Question

我正在尝试为Angular 5应用程序部署Angular Universal（最近从Angular 4迁移），我遇到了服务器端呈现选项的问题：

ng build --aot --app 1

scss文件中变量的路径在客户端工作，但在服务器端渲染命令中没有。我收到了bootstrap-sass

这样的错误

File to import not found or unreadable: bootstrap/variable.

在node_modules working：

中更改指向包的特定路径的路径

@import '~bootstrap-sass/assets/stylesheets/bootstrap/variables';

我需要修改包含bootstrap/variable的大约50个文件，但仍然可以接受。但是我的代码还包含一个特定的scss文件，它从组件到其他组件各不相同，如下所示：

@import 'supergazol/footer';

我可以通过大约50个文件来相应地改变它的路径，但它不是非常有效和耗时。有没有办法告诉Webpack找到正确的路径？

此路径的我的Angular CLI配置无效：

"stylePreprocessorOptions": {
        "includePaths": [
          "../node_modules/bootstrap-sass/assets/stylesheets",
          "../src/style/supergazol",
          "../src/style"
        ]
      },

文件夹结构：

src
    app
    assets
    environments
    style

Answer 1

试试这个，它可能会有所帮助。我认为您需要在.angular-cli.json文件中的应用程序中使用它（对于客户端和服务器应用程序）。

"stylePreprocessorOptions": {
        "includePaths": [
          "../node_modules/bootstrap-sass/assets/stylesheets",
          "/style/supergazol",
          "style"
        ]
      },

使用webpack包含服务器端呈现的scss路径

1 个答案: