Babel-jest 不会在 node_modules 中转译 JSX答案

【问题标题】：Babel-jest does not transpile JSX in node_modulesBabel-jest 不会在 node_modules 中转译 JSX
【发布时间】：2019-08-25 20:21:20
【问题描述】：

运行测试时，Babel-jest 不会在 node_modules 文件夹中转换 JSX / ES6 不使用来自node_modules 的其他组件的 React 组件正确通过了所有测试。

由于https://github.com/facebook/jest/issues/6229，尝试添加transformIgnorePatterns并重命名为babel.config.js

package.json

"devDependencies": {
    "@babel/core": "7.1.2",
    "@babel/node": "7.0.0",
    "@babel/plugin-syntax-dynamic-import": "7.2.0",
    "@babel/plugin-transform-modules-commonjs": "^7.4.0",
    "@babel/preset-env": "7.2.0",
    "@babel/preset-react": "7.0.0",
    "babel-eslint": "10.0.1",
    "babel-jest": "24.5.0",
    "babel-loader": "8.0.4",
    "jest": "24.5.0",
    "jest-dom": "3.1.3",
    .......
  },

babel.config.js

module.exports = {
  presets: [
    '@babel/preset-env',
    '@babel/preset-react',
  ],
  plugins: [
    '@babel/plugin-syntax-dynamic-import',
    '@babel/plugin-proposal-class-properties',
    'react-hot-loader/babel',
  ],
  env: {
    test: {
      plugins: ['@babel/plugin-transform-modules-commonjs', '@babel/plugin-proposal-class-properties'],
    },
  },
};

jest.config.js

module.exports = {
  transform: {
    '^.+\\.jsx?$': 'babel-jest',
  },
  moduleNameMapper: {
    '\\.(css|less|scss|sss)$': 'identity-obj-proxy',
  },
  testEnvironment: 'jsdom',
};

【问题讨论】：

由于依赖关系，这类问题通常相当复杂，因此我建议共享整个存储库，人们可以在其中获取您的工作目录的副本，以进行测试以找出问题。

标签： reactjs jestjs babeljs react-testing-library

【解决方案1】：

实际上，下面的链接对我有所帮助。从node_modules 添加transformIgnorePatterns 我的组件就足够了，所以babel-jest 忽略所有文件而不是我的组件
image from jestjs docs
https://jestjs.io/docs/en/tutorial-react-native#transformignorepatterns-customization

【讨论】：