Jest encountered an unexpected token SyntaxError: Unexpected token import #9718
Description
🐛 Bug Report
In my jest tests, when i attempt to run jest, this is output:
FAIL test/product.test.jsx
● Test suite failed to run
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:
/Users/resource/BeiKe/pikachu-static-front-owner/node_modules/glue-redux/es/index.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import _defineProperty from 'babel-runtime/helpers/defineProperty';
^^^^^^
SyntaxError: Unexpected token import
1 |
2 |
> 3 | import { createGlue, gluePair } from 'glue-redux';
| ^
4 | import confirmLoan from './confirmLoan';
5 | import Certification from './certification';
6 |
at Runtime.createScriptFromCode (../../.nvm/versions/node/v8.16.0/lib/node_modules/jest/node_modules/jest-runtime/build/index.js:1059:14)
at Object.<anonymous> (client/glue/glue.js:3:1)
my .babelrc:
{
"presets": [
"@babel/preset-react",
[
"@babel/preset-env",
{
"useBuiltIns": "usage",
"corejs": 3,
"targets": {
"chrome": 48,
"ie": 9,
"browsers": [
"> 1%",
"last 5 versions"
]
}
}
]
],
"plugins": [
"@babel/plugin-proposal-class-properties",
"@babel/plugin-syntax-dynamic-import",
"@babel/plugin-proposal-object-rest-spread"
]
}
my package.json
{
"jest": {
"transform": {
"^.+\\.jsx?$": "babel-jest"
},
"moduleFileExtensions": [
"js",
"jsx"
],
"moduleNameMapper": {
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga|css|less|scss)$": "identity-obj-proxy"
},
"testPathIgnorePatterns": [
"<rootDir>/node_modules/"
],
"transformIgnorePatterns": [
"/node_modules/(?!@babel/runtime|glue-redux)"
],
"collectCoverage": false
},
"dependencies": {
"antd-mobile": "^2.2.11",
"axios": "^0.18.0",
"babel-jest": "^25.2.3",
"chai": "^4.2.0",
"child_process": "^1.0.2",
"classnames": "^2.2.6",
"core-js": "^3.6.4",
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.2",
"eslint-friendly-formatter": "^4.0.1",
"fastclick": "^1.0.6",
"glue-redux": "1.1.8",
"history": "^4.7.2",
"js-pinyin": "^0.1.9",
"lodash": "^4.17.10",
"node-schedule": "^1.3.2",
"prettier": "^1.14.0",
"progress": "^2.0.3",
"prop-types": "^15.6.2",
"react": "^16.4.1",
"react-dom": "^16.4.1",
"react-loadable": "^5.4.0",
"react-redux": "^5.0.7",
"react-router": "^4.3.1",
"react-router-dom": "^4.3.1",
"react-router-redux": "^5.0.0-alpha.9",
"react-sticky": "^6.0.3",
"redux": "^3.5.2",
"redux-thunk": "^2.3.0",
"weixin-js-sdk": "^1.4.0-test"
},
"devDependencies": {
"@babel/cli": "^7.0.0",
"@babel/core": "^7.0.0",
"@babel/plugin-proposal-class-properties": "^7.0.0",
"@babel/plugin-proposal-object-rest-spread": "^7.0.0",
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
"@babel/plugin-transform-member-expression-literals": "^7.0.0",
"@babel/plugin-transform-property-literals": "^7.0.0",
"@babel/plugin-transform-runtime": "^7.0.0",
"@babel/polyfill": "^7.8.7",
"@babel/preset-env": "^7.0.0",
"@babel/preset-react": "^7.0.0",
"@babel/preset-stage-2": "^7.8.3",
"@babel/runtime-corejs2": "^7.0.0",
"autoprefixer": "^7.1.1",
"babel-eslint": "^9.0.0",
"babel-loader": "^8.0.0",
"babel-plugin-import": "^1.12.0",
"babel-plugin-transform-es2015-modules-commonjs": "^6.26.2",
"clean-webpack-plugin": "^0.1.19",
"copy-webpack-plugin": "^5.0.3",
"css-loader": "^0.28.11",
"eslint": "^4.19.1",
"eslint-config-standard": "^12.0.0",
"eslint-config-standard-react": "^7.0.2",
"eslint-loader": "^2.0.0",
"eslint-plugin-flowtype": "^3.2.0",
"eslint-plugin-import": "^2.17.2",
"eslint-plugin-jsx-a11y": "^6.0.3",
"eslint-plugin-node": "^9.1.0",
"eslint-plugin-promise": "^4.1.1",
"eslint-plugin-react": "^7.13.0",
"eslint-plugin-standard": "^4.0.0",
"file-loader": "^1.1.11",
"html-webpack-plugin": "^3.2.0",
"identity-obj-proxy": "^3.0.0",
"less": "^3.0.4",
"less-loader": "^4.1.0",
"mini-css-extract-plugin": "^0.4.1",
"optimize-css-assets-webpack-plugin": "^3.2.0",
"postcss-flexbugs-fixes": "^3.3.1",
"postcss-loader": "^2.1.5",
"px2rem-loader": "^0.1.9",
"redux-devtools": "^3.4.1",
"redux-devtools-dock-monitor": "^1.1.3",
"redux-devtools-log-monitor": "^1.4.0",
"source-map-loader": "^0.2.3",
"style-loader": "^0.21.0",
"svg-inline-loader": "^0.8.0",
"uglifyjs-webpack-plugin": "^1.2.7",
"url-loader": "^1.0.1",
"vconsole": "^3.3.0",
"webpack": "4.15.0",
"webpack-bundle-analyzer": "^3.3.2",
"webpack-cli": "^3.3.11",
"webpack-dev-server": "^3.1.4",
"webpack-manifest-plugin": "^2.0.3"
}
}
envinfo
$ npx envinfo --preset jest
System:
OS: macOS Mojave 10.14.3
CPU: (4) x64 Intel(R) Core(TM) i5-5350U CPU @ 1.80GHz
Binaries:
Node: 8.16.0 - ~/.nvm/versions/node/v8.16.0/bin/node
Yarn: 1.13.0 - /usr/local/bin/yarn
npm: 6.4.1 - ~/.nvm/versions/node/v8.16.0/bin/npm
Input Code
None
Expected behavior/code
None
Possible Solution
None
Additional context/Screenshots
None
How should I solve this problem? thx