[解決済み] cssからscssへのAngular-cli

質問

を読みました。 ドキュメント を使用する場合は scss 以下のコマンドを実行する必要があります。

ng set defaults.styleExt scss

しかし、そうしてそのファイルを作ると、やはりコンソールにこのエラーが表示されます。

styles.bundle.js:33Uncaught Error: Module build failed: Error: ENOENT:
no such file or directory, open
'/Users/Egen/Code/angular/src/styles.css'(…)

解決方法は？

Angular 6の場合 をチェックします。 公式ドキュメント

注 について @angular/cli よりも古いバージョンでは 6.0.0-beta.6 使用 ng set の代わりに ng config .

既存プロジェクトの場合

既存の angular-cli プロジェクトで、デフォルトの css スタイルを使用する場合は、いくつかの作業を行う必要があります。

1. デフォルトのスタイル拡張子を scss

で手動で変更 .angular-cli.json (Angular 5.x およびそれ以前) または angular.json (Angular 6+) を実行するか。

ng config defaults.styleExt=scss

エラーが出たら Value cannot be found. コマンドを使用します。

ng config schematics.@schematics/angular:component.styleext scss

(※ソースはこちら Angular CLI SASSオプション )

1. 既存の .css ファイルを .scss (例: styles.css と app/app.component.css)

2. CLIにstyles.scssを探すように指示する。

のファイル拡張子を手動で変更する。 apps[0].styles で angular.json

1. 新しいスタイル ファイルを見つけるためにコンポーネントを指定します。

を変更します。 styleUrls を新しいファイル名と一致させます。

今後のプロジェクトについて

Serginho が言及したように、スタイル拡張は ng new コマンド

ng new your-project-name --style=scss

今後作成するすべてのプロジェクトのデフォルトを設定したい場合は、次のコマンドを実行してください。

ng config --global defaults.styleExt=scss