javascript - Jest 遇到意外 token : SyntaxError: Unexpected Token {

Question

问题:

当我在另一台机器上运行代码时遇到此错误时，我正在使用 Jest 和 Enzyme 运行测试。

当我运行仅运行jest --coverage --verbose的npm test时，它每次都会收到此错误。但是，当我在工作笔记本电脑上运行它时，这种情况不会发生。

我想要弄清楚的是，当我运行测试脚本时，为什么会突破“{”标记。我看到有些人建议使用 babel-jest 会有帮助，但我不认为这是导致此问题的原因，因为它不会影响我的工作笔记本电脑。我还了解到 babel-jest 不能解决这个问题。

任何帮助将不胜感激。

<小时/>

这是它引用的设置文件:

setUptests.js

import { configure } from 'enzyme'; // eslint-disable-line import/no-extraneous-dependencies

import Adapter from 'enzyme-adapter-react-16'; // eslint-disable-line import/no-extraneous-dependencies

configure({ adapter: new Adapter() });

我的webpack.config.js:

const path = require('path');

module.exports = {
  entry: {
    base: path.resolve(__dirname, './app/app.jsx'),
    redux: path.resolve(__dirname, './app/reduxApp.jsx'),
  },
  output: {
    path: path.resolve(__dirname, './public'),
    filename: '[name].bundle.js',
  },
  module: {
    rules: [
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        loader: 'babel-loader',
        query: {
          presets: ['env', 'react', 'stage-2'],
        },
      },
    ],
  },
  resolve: {
    extensions: ['.js', '.jsx'],
  },
};

我的package.json有我的 Jest 的配置:

"jest": {
    "testURL": "http://localhost/",
    "setupTestFrameworkScriptFile": "./setUpTests.js",
    "testEnvironment": "node",
    "unmockedModulePathPatterns": [
      "node_modules/react/",
      "node_modules/enzyme/"
    ],
    "coverageThreshold": {
      "global": {
        "statements": 98,
        "branches": 91,
        "functions": 98,
        "lines": 98
      }
    }
  }

这里是我正在使用的依赖项列表:

  "dependencies": {
    "express": "^4.16.3",
    "prop-types": "^15.6.2",
    "react": "^16.4.2",
    "react-dom": "^16.4.2",
    "react-redux": "^5.0.7",
    "redux": "^4.0.0"
  },
  "devDependencies": {
    "babel": "^6.23.0",
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-preset-env": "^1.7.0",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-2": "^6.24.1",
    "enzyme": "^3.4.1",
    "enzyme-adapter-react-16": "^1.2.0",
    "eslint": "^4.19.1",
    "eslint-config-airbnb": "^17.0.0",
    "eslint-plugin-import": "^2.13.0",
    "eslint-plugin-jsx-a11y": "^6.1.1",
    "eslint-plugin-react": "^7.10.0",
    "jest": "^23.4.2",
    "jsdom": "^11.12.0",
    "nodemon": "^1.18.3",
    "react-test-renderer": "^16.4.2",
    "webpack": "^4.16.5",
    "webpack-cli": "^3.1.0"
  }

<小时/>

更新:

尝试从以下位置切换代码:从'enzyme'导入{configure}；到:从“enzyme”导入 enzyme ；

我目前认为这是一个导入问题。将继续研究以了解如何解决此问题。

Answer 1

我也遇到了同样的问题，在类似的问题中得到了解答。我解决这个问题的方法是安装两个类 babel 插件:

npm install --save babel-plugin-transform-class-properties
npm install --save babel-plugin-syntax-class-properties

并将它们包含在您的 .babelrc 文件中:

"plugins": [
  "transform-class-properties",
  "syntax-class-properties"
 ]

重新启动测试后，错误应该消失了:)祝你好运!