使用Angular CLI延迟加载应用程序主题样式

我正在尝试切换< link />的href.出于主题目的,SCSS主题位于我的monorepo的packages文件夹中,这些文件夹在node_modules中进行符号链接.我需要能够编译和引用这些.

我遇到了以下固定问题：angular/angular-cli#3401并且一直试图实现类似的东西：

"styles": [
    "styles.scss",{
        "input": "../node_modules/@org/themes/dark.scss","output": "dark","lazy": true
    }
],

我的理解(也许是不正确的)是这会将dark.scss文件编译成dist / dark.bundle.css并且我可以通过http://localhost:4200/dist/dark.bundle.css加载它但是它没有按预期工作.我误解了某些事情或完全错误吗？

如何编译node_modules中的SCSS文件,然后我可以在应用程序中延迟加载？我可以尝试另一种/更好的方法吗？

补充说明：

>使用Angular版本4.2.4
>使用Angular CLI 1.3.0版
> documentation for this approach
>我在monorepo工作,所以node_modules / @ org / themes是一个符号链接
>我已尝试使用ng serve –preserve-symlinks选项,以防出现上述问题.它没有任何区别

我已经调查了Angular Material docs website approaches this problem的方式,看起来他们有一个自定义构建脚本,在服务应用程序之前将SCSS文件编译为assets目录中的CSS文件.我认为上面修复的问题消除了对这一步的需要,但也许没有.这是唯一可行的方法吗？

解决了

感谢@Kuncevic.我错过了–extract-css标志.

工作配置：

"styles": [
    "styles.scss",{
        "input": "../node_modules/@org/themes/src/dark.scss","output": "themes/dark",

使用以下服务脚本,我可以通过http://localhost:4200/themes/dark.bundle.css访问它：

ng serve –extract-css –preserve-symlinks

{
    "input": "../node_modules/@org/themes/dark.scss","lazy": true
}