SCSS変数を使用して

Question

私は現在Angular 4アプリでangle-cliで作業していますが、私は小さな問題に遭遇しました。私は動的にスタイリングをロードできるコンポーネントを作成しようとしています。

私はコンポーネントComponentXを持っています。このコンポーネントには、たとえばSCSS変数colorを使用する必要があります。しかし、colorの値は、私がangle-cliで定義されたappを使ってロードしている別のSCSSに依存するはずです。

私は良い解決策を見つけようとしていますが、私はこの仕事をすることはできません。私は単純なインポートを使ってみましたが、成功しませんでした。

私はあなたが正しい方向に私を送ることができると思います:)

Answer 1

あなたのsrc/フォルダに_variables.scssを入れて.angular-cli.json

"stylePreprocessorOptions": { 
    "includePaths": [ 
    "." 
    ] 
} 

にこれらの行を追加することができ、あなたのコンポーネントで@import 'variables';を使用しています。 scssファイル。

設計上、すべてのcomponent.scssファイルがコンポーネントを分離した状態に保つために独自のスコープでコンパイルされているため、これより簡単にはなりません。