Jest 箭头语法导致错误

Question

我正在为 webpack 2 不是 React 项目的项目设置 Jest。

我已经安装了 jest-cli 和 babel-jest。

我收到这个错误：

.babel-rc:

{
  "presets": [
    "es2015"
  ],
  "plugins": [
    "syntax-jsx",
    ["transform-react-jsx", {"pragma": "html"}]
  ]
}

webpack.config.js:

var path = require('path')
var webpack = require('webpack')
var ExtractTextPlugin = require('extract-text-webpack-plugin')

module.exports = {
  devtool: 'source-map',
  entry: [
    'webpack-dev-server/client?http://localhost:3000',
    './src/index'
  ],
  output: {
    path: path.join(__dirname, 'dist'),
    filename: 'bundle.js'
  },
  module: {
    rules: [

      {
        test: /\.js$/,
        use: {
          loader: 'babel-loader'
        }
      },

      {
        test: /\.css$/,
        use: [
          'style-loader',
          {
            loader: 'css-loader',
            options: {
              modules: true,
              localIdentName: '[name]__[local]___[hash:base64:5]'
            }
          }
        ]
      },

      {
        test: /\.styl$/,
        use: [
          'style-loader',
          {
            loader: 'css-loader',
            options: {
              modules: true,
              localIdentName: '[name]__[local]___[hash:base64:5]'
            }
          },
          'stylus-loader'
        ],
      }

    ]
  },
  resolve: {
    extensions: ['.js'],
    modules: [
      path.join(__dirname, 'src'),
      'node_modules'
    ]
  },

  plugins: [
    new ExtractTextPlugin({ filename: 'style.css', allChunks: true }),
  ],

  jest: {
    moduleNameMapper: {
      '\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': '<rootDir>/__mocks__/fileMock.js',
      '\.(css|less)$': '<rootDir>/__mocks__/styleMock.js'
    }
  },

  'env': {
    'test': {
      'plugins': ['transform-es2015-modules-commonjs']
    }
  }
}

package.json:

{
  "name": "test",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "scripts": {
    "start": "node server.js",
    "test": "jest"
  },
  "babel": {
    "presets": [
      "es2015",
      "react",
      "stage-0"
    ]
  },
  "devDependencies": {
    "babel-core": "^6.23.1",
    "babel-jest": "^19.0.0",
    "babel-loader": "^6.3.2",
    "babel-plugin-transform-object-assign": "^6.22.0",
    "babel-preset-es2015": "^6.22.0",
    "babel-preset-react": "^6.23.0",
    "babel-preset-stage-0": "^6.22.0",
    "css-loader": "^0.26.2",
    "eslint": "^3.17.0",
    "extract-text-webpack-plugin": "^2.0.0",
    "identity-obj-proxy": "^3.0.0",
    "jest": "^19.0.2",
    "jest-cli": "^19.0.2",
    "regenerator-runtime": "^0.10.3",
    "style-loader": "^0.13.2",
    "stylus": "^0.54.5",
    "stylus-loader": "^2.5.0",
    "webpack": "^2.2.1",
    "webpack-dev-server": "^2.4.1"
  },
  "dependencies": {
    "@cycle/dom": "^16.0.0",
    "@cycle/run": "^3.0.0",
    "babel-plugin-transform-react-jsx": "^6.23.0",
    "bulma": "^0.3.2",
    "css-modules-require-hook": "^4.0.5",
    "eslint-plugin-jsx": "^0.0.2",
    "snabbdom-jsx": "^0.3.1",
    "xstream": "^10.3.0"
  }
}

如何消除错误？

Answer 1

使用 arrow function 不带参数 仍然需要括号。

以下代码应该有效：

test('adds a and b together', () => {
    expect(sum(1, 2)).toBe(3)
})

请注意，唯一不需要括号的情况是 只有一个参数。

您可以阅读文档 here。

Jest 箭头语法导致错误

Jest arrow syntax causes error

javascript

ecmascript-6

jestjs

webpack-2

babel-jest