Jest是否支持ES6导入/导出?


78

如果我import/export从ES6使用,那么我所有的Jest测试都会失败并显示以下错误:

意外的保留字

我将受测对象转换为使用旧式IIFE语法,然后突然我的测试通过了。或者,采用一个更简单的测试用例:

   var Validation = require('../src/components/validation/validation'); // PASS
   //import * as Validation from '../src/components/validation/validation' // FAIL

同样的错误。显然这里的导入/导出有问题。为了使测试框架满意,使用ES5语法重写代码对我来说是不切实际的。

我有通天的笑话。我尝试了来自GitHub问题的各种建议。到目前为止没有走。

文件package.json

 "scripts": {
    "start": "webpack-dev-server",
    "test": "jest"
  },
      "jest": {
        "testPathDirs": [
          "__tests__"
        ],
        "testPathIgnorePatterns": [
          "/node_modules/"
        ],
        "testFileExtensions": ["es6", "js"],
        "moduleFileExtensions": ["js", "json", "es6"]
      },

文件babelrc

{
  "presets": ["es2015", "react"],
  "plugins": ["transform-decorators-legacy"]
}

有解决办法吗?


确实帮助呢?

@GeorgePompidou-可能。我不确定该解决方案是否/如何适用于babel-jest
P.Brian.Mackey,2016年

这是在package.json或.babelrc中指定类似“ presets”:[“ es2015”]之类的问题。毕竟,您正在使用babel。

@GeorgePompidou-在这种情况下,解决方案不起作用。我已经有一个包含es2015,反应预设的babelrc。装在大口大口内的标准转粒工作。只是Jest框架无法处理它。
P.Brian.Mackey

它通过安装babel-preset-es2015和babel-preset-react软件包为这里的人工作。抱歉,如果我没有太大帮助,就没有这个问题。

Answers:


37

UPDATE 2020-ECMAScript模块(ESM)的本机支持


根据这个问题,ESP提供了ESM的本机支持jest@25.4.0。因此,您不再需要使用babel。在编写此答案时(05/2020),要激活该功能,您需要做三件事:

  • 确保您不import通过transform: {}在配置文件中进行设置来转换语句
  • node@^12.16.0 || >=13.2.0--experimental-vm-modules标志运行
  • 使用jest-environment-node或进行测试jest-environment-jsdom-sixteen

因此,您的Jest配置文件至少应包含以下内容:

export default {
    testEnvironment: 'jest-environment-node',
    transform: {}
    ...
};

并设置--experimental-vm-modules标志,您将必须按以下方式运行Jest:

node --experimental-vm-modules node_modules/jest/bin/jest.js

还要注意在Github问题中,该方法尚不支持该jest对象。因此,您可能需要手动导入它:

import {jest} from '@jest/globals'

我希望将来会有所改变


什么是“ jest-environment-node”,它与环境“ node”有什么区别?
akauppi '20年

2
这是一个用于测试的测试环境。这是jsdom默认。您可以在此处找到更多信息jestjs.io/docs/en/configuration#testenvironment-string
Radovan Kuka

我一直在用这种方法遇到Maximum call stack size exceededinternal/vm/module.js:315 const module = await linker(identifier, this);)。有办法避免这种情况吗?
Twiggeh

7
NODE_OPTIONS='--experimental-vm-modules' jest玩笑有点干净
Relisora

87

对另一个问题的回答来看,这可能更简单:


唯一的要求是将您的test环境配置为Babel,并添加ECMAScript 6转换插件:


第1步:

test环境添加到.babelrc项目的根目录中:

{
  "env": {
    "test": {
      "plugins": ["@babel/plugin-transform-modules-commonjs"]
    }
  }
}

第2步:

安装ECMAScript 6转换插件:

npm install --save-dev @babel/plugin-transform-modules-commonjs

就是这样。Jest将自动启用从ECMAScript模块到CommonJS的编译,而无需jest在内通知属性的其他选项package.json


11
如果您不想污染您的项目.babelrc,则可以在中的env密钥下添加上方的babel密钥package.json
Dan Dascalescu

好提示!谢谢@DanDascalescu!
Paulo Coghi,

事实上,有趣的巧合:我只是围绕工作这个玩笑错误通过移动的前一天babel抠出的package.json进入babel.config.js。该错误仅影响从项目的父目录导入的文件上的运行转换。
Dan Dascalescu

3
我相信最近的@babel/plugin-transform-modules-commonjs替代产品transform-es2015-modules-commonjs
-Albizia

2
伙计,这带我永远!谢谢!
卡马尔Stationwala

4

只需将Stage-0添加到您的.babelrc文件中即可。这是一个例子:

{
  "presets": ["es2015", "react", "stage-0"],
  "plugins": ["transform-decorators-legacy"]
}

1
PS:不要忘记通过NPM安装0级预设
勒兹万·Antalut

1
切勿在生产中使用stage-0或使用任何stage-*产品。这个答案是不好的做法。使用preset-env
fregante

3

对于更新的配置,我使用的是https://babeljs.io/setup#installation

选择“ JEST”并开心:

作为参考,当前配置为:

npm install --save-dev babel-jest

在您的package.json文件中,进行以下更改:

{
  "scripts": {
    "test": "jest"
  },
  "jest": {
    "transform": {
      "^.+\\.jsx?$": "babel-jest"
    }
  }
}

安装babel预设:

npm install @babel/preset-env --save-dev

创建一个.babelrc文件:

{
  "presets": ["@babel/preset-env"]
}

运行测试:

npm run test

1
这对我有用,谢谢!
瑞奇

0

除了安装babel-jest(默认情况下,Jest现在附带)之外,还请确保安装regenerator-runtime


0

我遇到了同样的问题。

这些是我所做的:

yarn add --dev babel-jest @babel/core @babel/preset-env

rootDir创建文件jest.config.js。

module.exports = {
    moduleFileExtensions: ["js", "json", "jsx", "ts", "tsx", "json"],
    transform: {
        '^.+\\.(js|jsx)?$': 'babel-jest'
    },
    testEnvironment: 'node',
    moduleNameMapper: {
        '^@/(.*)$': '<rootDir>/$1'
    },
    testMatch: [
        '<rootDir>/**/*.test.(js|jsx|ts|tsx)', '<rootDir>/(tests/unit/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx))'
    ],
    transformIgnorePatterns: ['<rootDir>/node_modules/']
};

然后进行文件babal.config.jsROOTDIR

像这样去:

module.exports = {
    "presets": ["@babel/preset-env"]
}

-6

我用解决了.default

尝试 var Validation = require('../src/components/validation/validation').default;

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.