在 create-react-app 中测试时出现“意外的令牌导入”答案

【问题标题】：'Unexpected token import' while testing in create-react-app在 create-react-app 中测试时出现“意外的令牌导入”
【发布时间】：2017-05-24 22:07:05
【问题描述】：

当我在我的项目文件夹中运行 npm test 时，我收到一条错误消息，指出 unexpected token import。当我使用 create-react-app 时，我假设我不需要配置任何东西，因为一切都应该是开箱即用的。

我不明白我是在某个地方犯了错误还是它是 create-react-app 问题。

【问题讨论】：

标签： jestjs create-react-app

【解决方案1】：

我认为这是因为您的 babel 配置不正确。

【讨论】：

我不用配置 babel。这就是使用 create-react-app 的全部意义所在。
你使用什么操作系统？
linux debian。它有什么关系？
如果是类linux操作系统，理论上应该没有问题。

【解决方案2】：

create-react-app 不是问题。

我的代码在 src/node_modules 文件夹中，它没有被 babel 转换，因为它不包括 node_modules。

【讨论】：

我遇到了同样的问题/解决方案。我的node_modules 包含一个用 ES6 编写但未编译的依赖项。我曾假设 babel install 会处理它，但 create-react-app 不会在 node_modules 上运行 babel/webpack。

【解决方案3】：

对于从 Google 发现此问题的任何人：

unexpected token import 错误通常表明解析 ES6 代码时出现问题，因为 import 不是早期版本的功能。通常，Chrome 等浏览器会运行 ES6，但在运行测试时会遇到错误。因此，使用create-react-app 运行yarn test 将暴露此错误。

直接的解决方案是查看 babel 是如何编译您的 ES6 代码的。在上面的例子中，create-react-app 已经包含了 webpack 和 babel。但是，他们假设您的 node_modules 已经编译，并且在编译过程中会跳过它。因此，即使您的项目中有 babel，它也不会编译所有 ES6 出于某种原因。

如果您使用的其他项目没有附带 webpack/babel 预设置，或者为 babel 编写了自定义设置，那么您应该首先进行调查。

【讨论】：