笑话说SyntaxError:意外的令牌导出-React,Material.io

时间:2019-09-24 19:03:56

标签: reactjs typescript jestjs babel-jest mdc

我正在使用Google Material IO组件React来构建应用程序。从一段时间开始,当我运行JEST进行测试时,就会看到下面提到的错误。

Jest encountered an unexpected token

This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

Here's what you can do:
 • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
 • If you need a custom transformation specify a "transform" option in your config.
 • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html

Details:

C:\Users\sganesh\Documents\gateway-web\packages\payments\node_modules\@material\textfield\helper-text\index.js:23
export * from './component';
^^^^^^

SyntaxError: Unexpected token export

  2 | import { useState, useEffect, useRef } from "react";
  3 | import { MDCTextField } from "@material/textfield";
> 4 | import { MDCTextFieldHelperText } from "@material/textfield/helper-text";
    | ^
  5 | import { MDCChipSet } from "@material/chips";
  6 | import { MDCFloatingLabel } from "@material/floating-label";
  7 | import { MDCTextFieldCharacterCounter } from '@material/textfield/character-counter';

  at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
  at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:579:25)
  at Object.<anonymous> (src/PaymentContainer/PaymentDetails/common/ChipInput/ChipInput.tsx:4:1)

笑话配置如下:-

const base = require('../jest.config.base.js')

// Individual pod can add their add own custom jest config 
module.exports = {
  ...base,
  "setupFiles": ['<rootDir>/src/setupTests.ts'],
  transformIgnorePatterns: [
    "<rootDir>/node_modules/?!(@rmwc|@material)/"
  ]
};

基本笑话配置为:

    module.exports = {
  roots: ["<rootDir>/src"],
  transform: {
    "^.+\\.(ts|tsx)$": "ts-jest",
    ".+\\.(css|scss)$": "<rootDir>/node_modules/jest-css-modules-transform"
  },
  moduleFileExtensions: [
    "ts",
    "tsx",
    "js",
    "tsx"
  ],
  "snapshotSerializers": ["enzyme-to-json/serializer"],
  verbose: true
};

1 个答案:

答案 0 :(得分:0)

尝试不使用<rootDir>

  transformIgnorePatterns: [
    'node_modules/?!(@rmwc|@material)/'
  ]