既存のプロジェクトをSCSSサポートプロジェクトに変換するには？

Question

私はangaular cliアプリケーションを持っています。今、私はそれをsassと互換性を持たせたいと思っています。しかし、それは起こっていません。

これは私の.TSは、私はその後、それは私がapp.componentと改名angular.cli.json.Thenに更新され commadラインにSCSSをdefaults.styleExtコードngのセットを実行

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

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.scss'] 
}) 
export class AppComponent { 
    title = 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry'; 
} 

ファイルであります.cssをapp.component.scssに手動で追加します。

私の.cssファイルは次のようなものです。

$primary-color:red; 

.head{ 
    color: $primary-color; 
} 

私の.htmlファイルが

<div class="head"> 
    {{title}} 
</div> 

下回るが、私はエラーを取得していますコンパイル中です。 エラーは次のとおりです cant解​​決app.component.scss.Fieldブラウザには有効なエイリアス設定が含まれていません。お手伝いください。事前に感謝していますか？

Answer 1

まず、angular-cli.jsonにCSSファイルの拡張子を変更します。

"defaults": { 
    "styleExt": "scss", 
    "component": {} 
} 

次、あなたのファイルの名前を変更！

app.component.css --> app.component.scss 

EDITあなたは再びそれをオフにしてみてくださいとしましたか？リニューアルng serve！