angularcli 轉變css工程爲scss工程

scss介紹

SCSS 是 Sass 3 引入新的語法，其語法徹底兼容 CSS3，而且繼承了 Sass 的強大功能。也就是說，任何標準的 CSS3 樣式表都是具備相同語義的有效的 SCSS 文件。另外，SCSS 還能識別大部分 CSS hacks（一些 CSS 小技巧）和特定於瀏覽器的語法，例如：古老的 IE filter 語法。
因爲 SCSS 是 CSS 的擴展，所以，全部在 CSS 中正常工做的代碼也能在 SCSS 中正常工做。也就是說，對於一個 Sass 用戶，只須要理解 Sass 擴展部分如何工做的，就能徹底理解 SCSS。大部分擴展，例如變量、parent references 和 指令都是一致的；惟一不一樣的是，SCSS 須要使用分號和花括號而不是換行和縮進

方法一：

新增的時候就默認爲scss

ng new My_New_Project --style=scss

方法二：

---

一、修改.angular-cli.json配置文件：

"defaults": {
     "styleExt": "scss",
}
"styles": [
        "styles.scss"
      ],

二、在src目錄下新增文件_variables.scss

三、style.scss文件裏配置以下：

@import 'variables';
@import '../node_modules/bootstrap/scss/bootstrap';