如何在启用CSS模块时排除引导程序文件

Question

我通过启用css-loader项目中的模块选项来使用bootstrap和CSS模块,不幸的css-loader是也在bootstrap文件上应用了作用域.

我有一个app.scss导入所有bootstrap sass文件的地方.然后我将app.scss文件导入我的app.js文件:

import "./app.scss";

  { test: /\.scss$/,
    use: [
        {loader: "style-loader"},
        {
          loader: "css-loader",
          options: {
            sourceMap: true,
            modules: true,
            localIdentName: "[path][name]__[local]--[hash:base64:5]"
          }
        },
        {loader: "sass-loader"}
      ]

例如bootstrap的.table类变成了类似的东西.app__table--19A_z

你怎么认为我可以为引导程序文件禁用CSS模块.

Answer 1

它可以通过模块rule.exclude来完成

条件不能匹配。约定是在此处提供字符串或字符串数​​组，但这不是强制执行的。

因此要排除 boostrap scss 文件应该像这样：

{
  test: /\.scss$/,
  use: ...
  exclude: [
    path.resolve(__dirname, "node_modules/bootstrap"),
  ]
}