外部依赖项的css-loader的localIdentName不起作用

时间:2019-12-23 05:59:31

标签: javascript reactjs webpack css-loader

我有几个存储库,一个是component_repo,另一个是project_repo。在component_repo中,我创建了可以在project_repo中导入的不同可重用组件。现在在两个仓库中,我都使用以下webpack配置来重命名我的CSS类名称:

            loader: 'css-loader',
            options: {
              localIdentName: '[name]__[local]__[hash:base64:5]',
              modules: true,
              importLoaders: 1,
              sourceMap: false,
            }
          },

现在由于某些原因,我想从component_repo重命名project_repo类,所以在project_repo中,我的配置是:

        test: /\.s?css$/,
        exclude: [/component_repo+[/\\].+\.scss/],
        use: [
          {
            loader: 'style-loader',
          },
          {
            loader: 'css-loader',
            options: {
              localIdentName: '[name]__[local]__[hash:base64:5]',
              modules: true,
              importLoaders: 1,
              sourceMap: false,
            }
          },
          {
            loader: 'postcss-loader',
            options: {
            }
          },
          {
            loader: 'sass-loader',
            options: {
              includePaths: [
                path.resolve('./node_modules/component_repo/src/styles/'),
                path.resolve('./node_modules/component_repo/src/styles/foundation'),
                path.resolve('./node_modules/component_repo/src/themes/Delicious'),
              ],
              sourceMap: false
            }
          },
          {
            loader: 'sass-resources-loader',
            options: {
              resources: [
                './node_modules/component_repo/src/styles/foundation.scss',
                './node_modules/component_repo/themes/Delicious/foundation.scss',
                './node_modules/component_repo/src/styles/shared.scss',
                './node_modules/component_repo/themes/Delicious/shared.scss',
              ],
            },
          },
        ],
      },

component_repo已将我排除在上述测试之外,所以仅component_repo我的测试就是这样:

        test: /component_repo+[/\\].+\.scss/,
        use: [
          {
            loader: 'style-loader',
          },
          {
            loader: 'css-loader',
            options: {
              localIdentName: '[name]__builder__[local]__[hash:base64:5]',
              modules: true,
              importLoaders: 1,
              sourceMap: false,
            }
          },
          {
            loader: 'postcss-loader'
          },
          {
            loader: 'sass-loader',
            options: {
              includePaths: [
                path.resolve(__dirname, 'node_modules', 'component_repo', 'src'),
                path.resolve(__dirname, 'node_modules', 'component_repo', 'src', 'styles'),
                path.resolve(__dirname, 'node_modules', 'component_repo', 'src', 'styles', 'components'),
              ],
              sourceMap: false
            }
          },
          {
            loader: 'sass-resources-loader',
            options: {
              resources: [
                path.resolve(__dirname, 'node_modules', 'component_repo', 'src', 'styles', 'calendar.scss'),
                path.resolve(__dirname, 'node_modules', 'component_repo', 'src', 'styles', 'foundation.scss'),
                path.resolve(__dirname, 'node_modules', 'component_repo', 'themes', 'Delicious', 'foundation.scss'),
                path.resolve(__dirname, 'node_modules', 'component_repo', 'src', 'styles', 'shared.scss'),
                path.resolve(__dirname, 'node_modules', 'component_repo', 'themes', 'Delicious', 'shared.scss'),
              ],
            },
          },
        ]
      },

因此,我一直认为localIdentName: '[name]__builder__[local]__[hash:base64:5]',应该重命名我的component_repo类名并在其中包含builder,但是它什么也没做。它没有给出任何错误或任何提示,只是我没有得到想要的输出。

0 个答案:

没有答案