如何在沒有@import的情況下加載組件的SCSS

Question

我開發了一個小型浮動操作組件。該組件由.ts，.html和.scss文件組成。此刻我將scss文件導入到app.scss中。

有沒有辦法在使用組件時自動加載SCSS？

Answer 1

我假設您知道ComponentMetadata上的styles和styleUrls屬性。 AFAIK，你不能通過styleUrls傳遞原始的，未編譯的.scss文件，但是設置模塊加載器來透明地處理編譯步驟相當容易。

如果你的模塊加載器的WebPack尤其如此：

@Component({ 
    selector  : "app", 
    styles  : [ require('./app.scss') ],  
    template  : `<route-view></route-view>`, 
}) 
export class AppContainer {} 

：對的WebPack配置，使您可以在您的應用程序中任何地方增加SCSS文件，然後使用它們 like so的一個例子見 here