用create-react-app开玩笑 - 意外的令牌错误

Question

我正在研究一个最近从旧的Webpack构建转换为使用的应用程序create-react-app.大多数过渡进展顺利,但我遇到了以前单元测试的一些主要问题.当我运行npm test具有标准的package.json测试脚本时"test": "react-scripts test --env=jsdom",它表示我的所有快照测试都失败了.这是很好的和预期的,因为已经有很多变化,测试需要更新.

但是,当我刚刚运行jest或者jest --updateSnapshot,我的所有测试都会立即失败并SyntaxError: Unexpected token出现错误,其中大部分与之相关import.这让我相信Jest没有使用Babel来正确转换ES6语法.

以前,我们使用带有以下设置的.babelrc文件:

{
"presets": ["env", "react", "stage-0", "flow"],
"plugins": ["transform-runtime", "add-module-exports", "transform-decorators-legacy"]
}

但由于create-react-app我已经将Babel包含在内,因此删除了此文件以及对Babel的任何引用.我的package.json也没有为Jest本身设置任何特殊脚本.

我已经尝试过添加一些以前使用过的Babel软件包了,但是在进一步阅读之后看起来似乎无论如何这些都不会起作用,除非我从那里弹出create-react-app并且这不是一个选项.

什么会导致npm test正确运行,但jest悲惨失败？

Answer 1

事实证明这是通天塔的问题。即使已create-react-app预先配置，我们仍然必须添加自定义配置，因为我们的应用最初不是使用构建的cra。我安装了一些新的dev依赖项：

"babel-cli": "^6.26.0",
"babel-jest": "^22.4.1",
"babel-preset-react-app": "^3.1.1",

并且还更新了.babelrc：

{
  "presets": ["babel-preset-react-app"]
}

现在，这两个jest和npm test两个工作，因为他们应该。