Question

因此，我正在尝试“ whitelabelyze”我的应用程序，以便为多个客户端提供多种设计选项。在组件的scss中，我需要加载一个'_variables.scss'，该文件将位于此'themes'文件夹下，其结构如下：

/
- themes
-- client-1
--- _variables.scss
-- client-2
--- _variables.scss

在我的angular.json内部，我有以下配置：

"projects": {
  "client-1": {
     ...
     "architect": {
       "build": {
         ...
         "options": {
           ...
           "stylePreprocessorOptions": {
             "includePaths": [
               "themes/client-1"
             ]
           },
           "styles": [
             "src/styles.scss",
           ]
           ...
         }
         ...
       }
     },

     "client-2": {
     ...
     "architect": {
       "build": {
         ...
         "options": {
           ...
           "stylePreprocessorOptions": {
             "includePaths": [
               "themes/client-2"
             ]
           },
           "styles": [
             "src/styles.scss",
           ]
           ...
         }
         ...
       }
     }
  }

根据documentation，我做对了，但是我的scss文件没有正确加载文件“变量”。这是我的scss文件上的导入：

@import "variables";

这是发生的错误：

ERROR in ./src/app/app.component.scss
Module build failed (from ./node_modules/sass-loader/lib/loader.js):

@import "variables";
^
      File to import not found or unreadable: variables.
      in /Users/erick/Projects/sample-project/src/styles.scss (line 2, column 1)

有什么建议可以在这里处理吗？

Answer 1

我找到了问题。

我正在themes/client-X内加载src/themes/client-X而不是angular.json。

Answer 2

在运行测试时，我遇到了同样的问题，解决方案是将相同的样式stylePreprocessorOptions添加到angular.json中的测试配置以及构建配置中

stylePreprocessorOptions不适用于@ Angular / cli 7

2 个答案: