請問如果是使用angular cli
然後需要在專案中使用SCSS或是LESS之類的樣式檔
要怎樣可以自動編譯成 CSS
而不是直接被inline 到 index.html
你有試過使用 --extract-css 的參數嗎?
如果是新建立的專案
就加上參數
ng new my-project --style=scss
如果想修改現有專案
ng set defaults.styleExt scss
或是修改.angular-cli.json檔案
“defaults”: {
“styleExt”: “css”, <=這裡改成scss
"component": {}
}
然後重新編譯
不過記得import的地方要記得原本的副檔名css也要改成scss
請問 --extract-css 要加在哪裡呢
謝謝大大，這樣雖然可以編譯
但是仍然是全部都包成一包被CLI直接加在HEAD裡
我是想編譯成個別的檔案
如果你的style 是編輯在各 component 的位置的話，那這部分是無法被抽離出來的，因為 component 引用 style 的方式會讓webpack 將樣式編譯成 js 的方式，
但是如果你是寫在 style.scss (global) 的話，那就會是獨立的檔案
使用 ng build --extract-css 或是 ng serve --extract-css (aliases: -ec) ，可以取得 css 而非 js 檔案
在 .angular-cli.json 的 styles 區塊的 stylesheet 會被合併成一個檔案
4個讚
感謝 Kevin大大提供的方法
己經解決了了