Question

注意：我通过将.pgpass文件夹中的所有代码直接移动到src/nod_modules文件夹并按照此短线程删除src来解决此问题：https://github.com/facebook/create-react-app/issues/4241 < / p>

我正在使用create-react-app并且无法运行Jest。

当我尝试将任何一个React组件导入我的测试文件时，我src/node_modules时出错：

yarn test

这是我的测试文件的样子：

Test suite failed to run

.../src/node_modules/common/ErrorMessage.js:1
({"Object.<anonymous>":function(
module,exports,require,__dirname,__filename,global,jest)
{import React from 'react'
^^^^^^

SyntaxError: Unexpected token import

但是，如果我在src文件的根目录下导入我的index.js，则不会抛出错误。此时，错误将在index.js导入的第一个文件中抛出。例如：

test.test.js

// test.test.js

// attempting to import
import ErrorMessage from '../node_modules/common/ErrorMessage.js'

// dummy test
test('adds 1 + 2 to equal 3', () => {
  expect(1 + 2).toBe(3)
})

index.js

import index from './index'

终端输出

import React from 'react'
import { render } from 'react-dom'
import './style/index.css'
import LoginContainer from './node_modules/user/LoginContainer'
import NewUser from './node_modules/user/NewUser'
// etc.

似乎在Jest的上下文中，Babel无法正确编译src / node_modules中的文件。我不知道如何纠正这个问题！任何见解都将不胜感激。

仅供参考，Jest应该与create-react-app开箱即用，我不想弹出。在没有弹出的情况下，我无法进行其他地方推荐的某些更改，例如更新package.json中的Jest设置。

Answer 1

node_modules/user/LoginContainer.js内的代码不是生产版本（babelified版本），因为它仍然具有那些import语句。

预先配置了create-react-app的Jest，在运行测试之前从babel-transformation中排除了node_modules内的所有内容，假设node_modules中的代码将被预先区分化。

由于你的node_modules中的模块不是babelified，jest遇到import语句时会立即抛出错误。

<强>解决方案

1。您必须拥有正在使用的node_module的构建脚本。尝试将模块的生产版本放在node_modules中。这样做可以解决问题，但也会产生更多问题（根据我的经验）。

2。明确开始配置jest及其依赖项而不弹出。基本上通过将测试脚本更改为jest --env=jsdom。您需要显式安装jest，react-dom，babel-transforms- *，然后使用package.json中的jest配置进行配置。

在这里，您需要关注两个主要配置选项 - transformIgnorePatterns和transform。

简而言之，改变一切，并将所有已经转变的东西包含在内。

查看Jest configuration部分了解更多详情。

Answer 2

尝试在您的应用程序中添加.bablerc文件

{
  "presets": ["es2015", "react"]
}

您需要指定要使用的预设，以便在运行测试用例时开玩笑地使用它们。 Jest不了解webpack，因此必须在此文件中提及预设。

Answer 3

要跟上@Himanshu Singh的回答，将其添加到package.json中可以帮助我解决此错误。

{
  test: react-scripts test --transformIgnorePatterns \"node_modules/(?!ui-core)/\" --env=jsdom
}

create-react-app＆amp; jest - SyntaxError：意外的令牌导入

3 个答案: