Jest给出了一个错误:"SyntaxError:意外的令牌导出"

Question

我正在使用Jest来测试我的React应用程序.

最近,我将DeckGL添加到了我的应用程序中.我的测试因此错误而失败:

Test suite failed to run

/my_project/node_modules/deck.gl/src/react/index.js:21
export {default as DeckGL} from './deckgl';
^^^^^^

SyntaxError: Unexpected token export

  at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:318:17)
  at Object.<anonymous> (node_modules/deck.gl/dist/react/deckgl.js:9:14)
  at Object.<anonymous> (node_modules/deck.gl/dist/react/index.js:7:15)

这似乎是Jest在运行它的测试之前转换节点模块的问题.

这是我的.babelrc:

{
  "presets": ["react", "es2015", "stage-1"]
}

这是我的开玩笑设置:

"jest": {
    "testURL": "http://localhost",
    "setupFiles": [
      "./test/jestsetup.js"
    ],
    "snapshotSerializers": [
      "<rootDir>/node_modules/enzyme-to-json/serializer"
    ],
    "moduleDirectories": [
      "node_modules",
      "/src"
    ],
    "moduleNameMapper": {
      "\\.(css|scss)$": "<rootDir>/test/EmptyModule.js"
    }
  },

我似乎有正确的事情需要改造export {default as DeckGL }.所以任何想法都会出错？

Answer 1

这意味着,文件不是通过TypeScript编译器转换的,例如因为它是带有TS语法的JS文件,或者它作为未编译的源文件发布到npm.这是你可以做的.

调整transformIgnorePatterns白名单:

{
  "jest": {
    "transformIgnorePatterns": [
      "node_modules/(?!@ngrx|(?!deck.gl)|ng-dynamic)"
    ]
  }
}

默认情况下,Jest不会转换node_modules,因为它们应该是有效的JavaScript文件.但是,图书馆作者认为你会编译他们的资源.所以你必须明确告诉Jest.上面的片段意味着@ngrx,deck和ng-dynamic将被转换,即使它们是node_modules.

Answer 2

这是因为Node.js无法处理ES6模块.

因此,您应该将模块转换为CommonJS.

如果你使用Babel 7 =>

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

并且仅用于测试用例添加到.babelrc,Jest自动给出NODE_ENV = test全局变量.

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

或者如果你使用Babel 6 =>

npm install --save-dev babel-plugin-transform-es2015-modules-commonjs

到.babelrc

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

Answer 3

尽管上面的答案中提到了该页面上的解决方法#2 ，但该页面上的解决方法#1 为我解决了这个问题，因此它们也可能有效。

“在配置中指定对应包的commonjs版本的入口moduleNameMapper”

jest.config.js

    moduleNameMapper: {
        "^uuid$": require.resolve("uuid"), 
        "^jsonpath-plus$": require.resolve("jsonpath-plus") 
...

Answer 4

就我而言，我在文件 package.json 中使用此配置：

"jest": {
    "transformIgnorePatterns": [
      "!node_modules/"
    ]
  }

Answer 5

Jest 默认不会编译目录中的node_modules文件。

transformIgnorePatterns [数组]

默认值：["/node_modules/"]

转换前与所有源文件路径匹配的正则表达式模式字符串数组。如果测试路径匹配任何模式，则不会被转换。默认：["/node_modules/"]

DeckGL 似乎在 ES6 中，为了让 jest 能够阅读它，您还需要编译它。
为此，只需在transformignorePatterns

"transformIgnorePatterns": ["/node_modules/(?!deck\.gl)"]

https://facebook.github.io/jest/docs/en/configuration.html#transformignorepatterns-array-string

Answer 6

我在 monorepo 上遇到了这个问题。根目录中的一个包node_modules破坏了我的测试。我通过将本地.babelrc文件更改为babel.config.js. 说明：https ://github.com/facebook/jest/issues/6053#issuecomment-383632515

Answer 7

而且，如果您使用的是“ create-react-app”，则不允许您通过package.json中的 Jest属性指定“ transformIgnorePatterns”

按照这个https://github.com/facebook/create-react-app/issues/2537#issuecomment-390341713

您可以在package.json中使用以下CLI 进行覆盖，并且可以使用：

"scripts": { "test": "react-scripts test --transformIgnorePatterns \"node_modules/(?!your-module-name)/\"", },