为什么Jest尝试解析index.ts中的每个组件?

时间:2018-03-07 16:04:25

标签: javascript reactjs typescript jestjs

因此,我使用Jest(使用Enzyme)来测试Typescript-React项目,并且遇到了别名模块的问题。

我知道问题本身并没有找到模块,因为它找到了正确的模块。我认为问题可能是我的一个文件的结构。

jest.config.js

module.exports = {
  "collectCoverage": false,
  "collectCoverageFrom": [
    "!**/*.d.ts",
    "src/**/*.{js,jsx,ts,tsx}"
  ],
  "coverageDirectory": "test",
  "moduleFileExtensions": [
    "ts",
    "tsx",
    "js",
    "jsx",
    "json",
    "node"
  ],
  "testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$",
  "testEnvironment": "node",
  "testURL": "http://localhost",
  "transform": {
    "^.+\\.css$": "<rootDir>/config/jest/cssTransform.js",
    "^.+\\.tsx?$": "ts-jest"
  },
  "transformIgnorePatterns": [
    "[/\\\\]node_modules[/\\\\].+\\.(js|jsx|ts|tsx)$"
  ],
  "resolver": "jest-webpack-resolver",
  "moduleNameMapper": {
    "^react-native$": "react-native-web",
    "^components$": "<rootDir>/src/components",
    "^reducers$": "<rootDir>/src/reducers",
    "^actions$": "<rootDir>/src/actions",
    "^selectors$": "<rootDir>/src/selectors",
    "^services$": "<rootDir>/src/services",
    "^views$": "<rootDir>/src/views",
    "^domains$": "<rootDir>/src/domains"
  },
};

我正在测试的组件中使用的导入:

import { Label } from 'components';

我的项目结构在组件中引出以下方式:

src
  |_ components
   |_ // ..various folders with React components
   |_ index.ts

我的index.tsx基本上是这样的:

export { default as Label } from './Label/Label'
// export other components

发生的事情如下:

当我运行Jest时,它会解析我的组件&#39;模块很好,它在我的webpack.alias中是一样的,但是破坏测试运行的是它开始构建&#39; (我不确定它是否真的构建了吗?)其他组件,并开始上升依赖树,因为某些组件我甚至没有测试,最终会因为它一直到我的主索引而中断运行整个应用程序的.tsx文件。

问题是我构建我的index.ts以导出我的所有组件的方式吗?

1 个答案:

答案 0 :(得分:0)

我也有同样的问题。这似乎与 jest 拥有自己的模块解析器有关。也许这有帮助:https://jestjs.io/docs/ecmascript-modules