reactjs – 为什么Jest在测试React组件时会抛出“Unexpected token ILLEGAL”?

我按照 Jest – React tutorial来测试React组件.

不幸的是,Jest抛出:

SyntaxError: /Users/mishamoroshko/react-playground/src/search-panel/questions/__tests__/questions-test.js: /Users/mishamoroshko/react-playground/src/search-panel/questions/questions.js: Unexpected token ILLEGAL
at Contextify.sandbox.run (/Users/mishamoroshko/react-playground/node_modules/jest-cli/node_modules/jsdom/node_modules/contextify/lib/contextify.js:12:24)
at JSDomEnvironment.runSourceText (/Users/mishamoroshko/react-playground/node_modules/jest-cli/src/JSDomEnvironment.js:108:22)
at Object.runContentWithLocalBindings (/Users/mishamoroshko/react-playground/node_modules/jest-cli/src/lib/utils.js:341:23)

重现:

> git clone git@github.com:SEEK- Jobs / react-playground.git
> cd react-playground
> npm安装
> npm测试

有任何想法吗?

更新1:

我想知道问题是Jest不知道ES6,我需要使用6to5-jest.

有没有办法在package.json中指定2个预处理器?

"jest": {
  "rootDir": "src","scriptPreprocessor": "../preprocessor.js","unmockedModulePathPatterns": [
    "../node_modules/react"
  ]
}

解决方法

确实,添加 6to5-jest解决了这个问题.

以下是我在Jest中实现多个scriptPreprocessors的方法:

// preprocessor.js

var ReactTools = require('react-tools');
var to5 = require('6to5-jest').process;

module.exports = {
  process: function(src,filename) {
    return ReactTools.transform(to5(src,filename));
  }
};

如果您有更好的方法来实现这一点,请发表评论.

相关文章

react 中的高阶组件主要是对于 hooks 之前的类组件来说的,如...
我们上一节了解了组件的更新机制,但是只是停留在表层上,例...
我们上一节了解了 react 的虚拟 dom 的格式,如何把虚拟 dom...
react 本身提供了克隆组件的方法,但是平时开发中可能很少使...
mobx 是一个简单可扩展的状态管理库,中文官网链接。小编在接...
我们在平常的开发中不可避免的会有很多列表渲染逻辑,在 pc ...