webpack - 配置 Jest 模仿 webpack 解析 root 和解析别名

Question

我正在使用 Webpack 和 Jest 建立一个项目。目前，Webpack 解决了配置导致 Jest 测试复杂化的问题。在我的 webpack 配置中，我设置了以下选项:

  resolve: {
    root: [__dirname + "/src/" ],
    extensions: ['', '.js', '.coffee', '.jsx', '.css', '.scss', '.svg']
  }

这让我需要以下资源和模块:

import UnknownImg from 'assets/unknown';

上面的内容实际上存在(相对于我的项目根目录)src/assets/unknown.svg。

但是，当我对包含上述行的文件运行测试时，在解析所需模块/ Assets 的路径时会出现错误。

错误:/Users/byronsm/dev/nerve-center/src/components/organisms/system_status.jsx:无法从“/Users/byronsm/dev/nerve-center/”中找到模块“assets/unknown” src/组件/有机体'

在这种情况下，它似乎正在对导入的模块路径进行相对查找。有没有办法让 Jest 的行为与 Webpack 相同？

Answer 1

官方 jest 文档中现已提供解决方案。请参阅Webpack Tutorial .

简而言之，将 modulePaths 选项添加到 package.json 中的 jest 配置中:

"jest": {
    "modulePaths": ["src"], 
    ...
}