SCSS變量使用

Question

我目前正在使用angular-cli開發Angular 4應用程序，並且遇到了一個小問題。我試圖創建一個可以動態加載樣式的組件。

我有一個組件ComponentX，它應該使用一個SCSS變量color爲例。然而，color的值應該取決於我通過angular-cli定義的應用程序加載的不同SCSS。

我試圖找到一個很好的解決方案，但是我無法完成這項工作。我嘗試使用簡單的導入，但沒有成功。

我希望你能在正確的方向給我:)

Answer 1

您可以在src/文件夾放_variables.scss和這些行添加到.angular-cli.json

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

然後在你的組件中使用@import 'variables';。 scss文件。

它不會比這更容易，因爲通過設計，每個component.scss文件都被編譯在其自己的作用域中以保持組件分離。