Umi: 通过 npm link 引入到 node_modules 中的模块,会应用 CSS Modules;

Created on 31 Jul 2019  ·  1Comment  ·  Source: umijs/umi

What happens?

有时当需要在一个实际项目中调试正在开发的组件库时,会需要通过 npm linkyarn link 将本地的组件库模块引入到项目中,但 CSS Modules 会应用到这些模块所加载的 CSS 文件上,但正常情况下,node_modules 中的文件应当是被忽略的。

最小可复现仓库

请使用 yarn create umi 创建,并上传到你的 GitHub 仓库


复现步骤,错误日志以及相关配置

  1. 项目开启 CSS Modules;
  2. 通过 npm linkyarn link 命令引入一个本地模块;
  3. 该模块通过 import "./index.css"; 引入一些 CSS 样式文件;

此时该 UI 组件所引入的样式文件会被应用 CSS Modules。

相关环境信息

  • Umi 版本:2.8.11
  • Node 版本:10.16.0
  • 操作系统:macOS Catalina 10.15 Beta版 19A512f

Most helpful comment

默认传递给 loader include/exclude 是该模块的绝对路径,和这个配置有关:
https://webpack.js.org/configuration/resolve/#resolvesymlinks

或者开发环境时使用:
https://umijs.org/zh/config/#cssmodulesexcludes

export default {
  chainWebpack(config) {
    config.resolve.symlinks(false);
  },

  // or (env dev)
   cssModulesExcludes: [xxx],
}

>All comments

默认传递给 loader include/exclude 是该模块的绝对路径,和这个配置有关:
https://webpack.js.org/configuration/resolve/#resolvesymlinks

或者开发环境时使用:
https://umijs.org/zh/config/#cssmodulesexcludes

export default {
  chainWebpack(config) {
    config.resolve.symlinks(false);
  },

  // or (env dev)
   cssModulesExcludes: [xxx],
}
Was this page helpful?
0 / 5 - 0 ratings