我是Angular的新手，我來自Ember社區(qū)。嘗試使用基于Ember-CLI的新Angular-CLI。我需要知道在新的Angular項(xiàng)目中處理SASS的最佳方法。我嘗試使用該存儲(chǔ)ember-cli-sass庫來查看它是否可以正常運(yùn)行，因?yàn)锳ngular-CLI的許多核心組件都運(yùn)行于Ember-CLI模塊。它沒有用，但是再不確定我是否配置錯(cuò)誤。另外，在新的Angular項(xiàng)目中組織樣式的最佳方法是什么？最好將sass文件與組件放在同一文件夾中。
3 回答
喵喵時(shí)光機(jī)
TA貢獻(xiàn)1846條經(jīng)驗(yàn) 獲得超7個(gè)贊
當(dāng)您使用angular cli創(chuàng)建項(xiàng)目時(shí)，請(qǐng)嘗試以下操作：
ng new My_New_Project --style=sass
這將生成帶有預(yù)定義sass文件的所有組件。
如果要使用scss語法，請(qǐng)使用以下命令創(chuàng)建項(xiàng)目：
ng new My_New_Project --style=scss
如果要更改項(xiàng)目中的現(xiàn)有樣式
ng set defaults.styleExt scss
Cli處理其余的工作。
對(duì)于最新版本
為了使Angular 6使用CLI在現(xiàn)有項(xiàng)目上設(shè)置新樣式：
ng config schematics.@schematics/angular:component.styleext scss
或直接進(jìn)入angular.json：
"schematics": {
"@schematics/angular:component": {
"styleext": "scss"
}
}
回首憶惘然
TA貢獻(xiàn)1847條經(jīng)驗(yàn) 獲得超11個(gè)贊
更新Angular 6+
新項(xiàng)目
當(dāng)生成一個(gè)新的項(xiàng)目與角CLI，指定CSS預(yù)處理器
使用SCSS語法
ng new sassy-project --style=scss
使用SASS語法
ng new sassy-project --style=sass
更新現(xiàn)有項(xiàng)目
通過運(yùn)行在現(xiàn)有項(xiàng)目上設(shè)置默認(rèn)樣式
使用SCSS語法
ng config schematics.@schematics/angular:component.styleext scss
使用SASS語法
ng config schematics.@schematics/angular:component.styleext sass
上面的命令將使用以下命令更新您的工作區(qū)文件（angular.json）
"schematics": {
"@schematics/angular:component": {
"styleext": "scss"
}
}
在哪里styleext可以是scss或sass根據(jù)選擇。
原始答案（針對(duì)Angular <6）
新項(xiàng)目
對(duì)于新項(xiàng)目，我們可以設(shè)置選項(xiàng)--style=sass或--style=scss根據(jù)所需的口味SASS / SCSS
使用SASS語法
ng new project --style=sass
使用SCSS語法
ng new project --style=scss
然后安裝node-sass，
npm install node-sass --save-dev
更新現(xiàn)有項(xiàng)目
要使用angular-cli來編譯sass文件node-sass，我必須運(yùn)行，
npm install node-sass --save-dev
安裝node-sass。然后
用于SASS語法
ng set defaults.styleExt sass
用于SCSS語法
ng set defaults.styleExt scss
將默認(rèn)的styleExt設(shè)置為sass
（要么）
改變styleExt到sass或scss為期望的語法中.angular-cli.json，
用于SASS語法
"defaults": {
"styleExt": "sass",
}
用于SCSS語法
"defaults": {
"styleExt": "scss",
}
盡管它生成了編譯器錯(cuò)誤。
ERROR in multi styles
Module not found: Error: Can't resolve '/home/user/projects/project/src/styles.css' in '/home/user/projects/project'
@ multi styles
通過更改.angular-cli.json，
"styles": [
"styles.css"
],
要么
用于SASS語法
"styles": [
"styles.sass"
],
用于SCSS語法
"styles": [
"styles.scss"
],
添加回答
舉報(bào)
0/150
提交
取消