11

dashgumという名前の無料の HTML テーマをインターネットからダウンロードしました。angular-cliを使用してAngular2アプリケーションに実装しています。css ファイルを .scss に変換し、コードを angular アプリケーションに貼り付けました。次に、 styles.scssという名前のグローバル スタイル ファイルにファイルをインポートして、次のようにスタイルをアプリケーションに適用しました。

@import url('./scss/bootstrap.scss');
@import url('./scss/font-awesome/css/font-awesome.scss');
@import url('./scss/zabuto_calender.scss');
@import url('./scss/gritter/css/jquery.gritter.scss');
@import url('./scss/lineicons/style.scss');
@import url('./scss/style.scss');
@import url('./scss/style-responsive.scss');

デバッグ中に直面している問題は、すべてのスタイルが次のようにブラウザーに埋め込まれたスタイルとして表示されることです (スタイル タグに注意してください)。

ここに画像の説明を入力

テーマのように検査中にスタイルを外部スタイルとして表示したい。次のスクリーンショットで注意してください。

ここに画像の説明を入力

これらは Angular 2 のデフォルト設定です。これは、検査時にスタイルが埋め込まれて表示されるように明らかな変更を加えていないためです。検査時にスタイルが外部スタイルとして表示されるように、Angular 2 の設定を変更する既知の方法はありますか? 埋め込まれたスタイルにより、デバッグが難しくなります。解決策を指摘する助けをいただければ幸いです。

4

2 に答える 2

2

私は、ブラウザーで調べると、グローバル スタイルの .scss ファイルにインポートされたスタイルが常に埋め込まれているように見えることを知りました。css を外部スタイルとして表示する場合は、コンポーネントで使用する必要があります。

編集:

上記のtoioskiの回答を参照してください。

于 2016-11-16T10:11:08.137 に答える