我正在开发一个应用程序,该应用程序最近已从旧的Webpack构建转换为use create-react- app。大部分过渡都进行得很顺利,但是我在先前的单元测试中遇到了一些主要问题。当我运行npm test带有标准package.json测试脚本的时"test": "react-scripts test --env=jsdom",它说我所有的快照测试都失败了。这很好并且可以预料,因为已经进行了很多更改,并且需要更新测试。
create-react- app
npm test
"test": "react-scripts test --env=jsdom"
但是,当我刚运行jest或时,我的jest --updateSnapshot所有测试都立即失败,并显示SyntaxError: Unexpected token错误,其中大多数与相关import。这使我相信Jest没有使用Babel正确转换ES6语法。
jest
jest --updateSnapshot
SyntaxError: Unexpected token
import
以前,我们使用.babelrc文件进行以下设置:
{ "presets": ["env", "react", "stage-0", "flow"], "plugins": ["transform-runtime", "add-module-exports", "transform-decorators-legacy"] }
但是由于Babel已包含在其中,因此create-react- app我删除了此文件以及所有对Babel的引用。我的package.json也没有为Jest本身设置任何特殊的脚本。
我曾尝试重新添加一些以前使用过的Babel软件包,但是在进一步阅读之后,除非我退出,否则这些软件包似乎都无法正常工作create-react- app,目前这不是一个选择。
是什么会导致npm test运行正常但jest失败的原因呢?
事实证明这是通天塔的问题。即使已create-react- app预先配置,我们仍然必须添加自定义配置,因为我们的应用最初不是使用构建的cra。我安装了一些新的dev依赖项:
cra
"babel-cli": "^6.26.0", "babel-jest": "^22.4.1", "babel-preset-react-app": "^3.1.1",
并且还更新了.babelrc:
.babelrc
{ "presets": ["babel-preset-react-app"] }
现在,这两个jest和npm test两个工作,因为他们应该。