导入语句后开玩笑的意外标识符答案

【问题标题】：Jest Unexpected Identifier after import statement导入语句后开玩笑的意外标识符
【发布时间】：2018-07-16 17:13:28
【问题描述】：

我正在尝试使用 Jest 为我正在为 Rails 应用程序编写的 React 前端设置一些测试。但是，当我尝试运行一个简单的测试时，Jest 在我的 import 语句后失败并出现 Unexpected 标识符。

blah.js

const fun = () => "fun";

export default fun;

blah.test.js

const x = 4;

import fun from './blah';

it('is fun', () => {
    fun();
});

运行 yarn test 失败

import fun from './blah';
       ^^^

SyntaxError: Unexpected identifier

  at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)

我在导入之前在测试文件中加入了const 声明，看看它是否无法接受 ES2015，但既然它通过了，我认为 babel 没有问题。

我看到很多关于“意外令牌导入”错误的问题 - 这似乎不同，因为它不是抱怨导入令牌，而是抱怨它之后的内容。

关于如何克服这个问题有什么建议吗？

作为参考，这里是我的配置文件：

.babelrc

{
  "presets": [
    [
      "env",
      {
        "modules": false,
        "targets": {
          "browsers": "> 1%",
          "uglify": true
        },
        "useBuiltIns": true
      }
    ],
    "react"
  ],
  "plugins": [
    "syntax-dynamic-import",
    "transform-object-rest-spread",
    [
      "transform-class-properties",
      {
        "spec": true
      }
    ]
  ]
}

package.json

{
  "dependencies": {
    "@rails/webpacker": "3.5",
    "prop-types": "^15.6.2",
    "react": "^16.4.1",
    "react-dom": "^16.4.1",
    "react_ujs": "^2.4.4"
  },
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-jest": "^23.4.0",
    "babel-plugin-transform-es2015-modules-commonjs": "^6.26.2",
    "babel-preset-env": "^1.7.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "jest": "^23.4.1",
    "webpack-dev-server": "2.11.2"
  },
  "scripts": {
    "test": "jest"
  },
  "jest": {
    "roots": [
      "spec/javascript"
    ],
    "moduleDirectories": [
      "node_modules",
      "app/javascript/components"
    ]
  }
}

【问题讨论】：

标签： ruby-on-rails babeljs jestjs

【解决方案1】：

好的，看来问题出在我的.babelrc 文件中。正确的版本是这样的：

babel.rc

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

【讨论】：