最新angular項目搭建+引入scss

1，進入要新建項目的文件夾中，右鍵打開GIT命令框，輸入命令：ng new +項目名稱

ng new my-app

2，命令行輸入：cd my-app

3，啓動項目：ng serve --open   打開如下頁面表示啓動成功~~

4，引入scss,命令行輸入：$ cnpm install node-sass  sass-loader -D

5，angular6以上項目沒有angular-cli.json文件。修改angular.json配置：

"projects": {
    "my-app": {
      "projectType": "application",
      "schematics": {
        "@schematics/angular:component":{
			    "styleext":"scss"
			}
      },
      ...
      "architect": {
        "build": {
          "options": {
            "styles": [
              "src/styles.scss"
            ],
            "scripts": []
          },
        },
      },

6，修改根目錄下styles.css爲styles.scss，以及app目錄下app.component.css爲app.component.scss

7，修改app.component.ts中

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'my-app';
}

8，測試

有上圖效果就OK了~