Babel 在运行 Jest 时不会编译 .test.js 文件

Question

在运行 yarn run jest --no-cache 时，会抛出一个错误：

SyntaxError: Unexpected token import

我最好的猜测是 babel 没有到达这个测试文件。我需要将它们包含在 .babelrc 中吗？

小路：

/src/tests/LandingPage.test.js

测试文件：

import React from 'react';
import ReactShallowRenderer from 'react-test-renderer/shallow';
import LandingPage from '../../components/LandingPage';

test('Should render LandingPage correctly', () => {
  const renderer = new ReactShallowRenderer();
  renderer.render(<LandingPage />);
  expect(renderer.getRenderOutput()).toMatchSnapshot();
});

.babelrc :

{
  "presets": [
    "env",
    "react"
  ],
  "plugins": [
    "transform-class-properties",
    "transform-object-rest-spread"
  ]
}

Answer 1

感谢@hannad rehmann 向正确方向推动这里是对我有用的解决方案。

安装 babel-jest

yarn add babel-jest --dev

为测试环境配置 .babelrc

Jest 会自动将您的环境设置为测试，因此将您想要的任何配置复制到测试环境中。

{
  "presets": [
    "env",
    "react"
  ],
  "plugins": [
    "transform-class-properties",
    "transform-object-rest-spread"
  ],
  "env": {
    "test": {
      "presets": [
        "env",
        "react"
        ],
      "plugins": [
        "transform-class-properties",
        "transform-object-rest-spread"
      ]
    }
  }
}

添加jest.config.json到项目根目录

{
  "transform": {
    "^.+\\.jsx?$": "babel-jest"
  }
}

最后，让您的测试脚本知道在哪里可以找到配置文件

我刚刚将它添加到 package.json 中的测试脚本中，但您也可以在命令行中运行它。

"scripts": {
    "test": "jest --config=jest.config.json --watch"
},