javascript - ' Jest 在反应应用程序上遇到了意外的令牌 {' 错误
问题描述
我似乎无法解决这个问题。我已经尝试了一切(这么多!)我可以在网上找到这个问题,但它似乎并没有解决。以下是配置
包.json
{
"scripts": {
"test": "jest --no-cache",
"test:watch": "npm run test -- --watch"
},
"devDependencies": {
"@babel/core": "^7.5.4",
"@babel/plugin-proposal-class-properties": "^7.5.5",
"@babel/preset-env": "^7.5.4",
"@babel/preset-flow": "^7.0.0",
"@babel/preset-react": "^7.0.0",
"babel-jest": "^24.9.0",
"babel-loader": "^8.0.6",
"babel-plugin-lodash": "^3.3.4",
"babel-plugin-module-resolver": "^3.2.0",
"babel-plugin-recharts": "^1.2.0",
"babel-plugin-transform-imports": "^2.0.0",
"flow-bin": "^0.106.1",
"flow-typed": "^2.6.1",
"html-loader": "^0.5.5",
"html-webpack-plugin": "^3.2.0",
"jest": "^24.9.0",
"lodash-webpack-plugin": "^0.11.5",
"redux-devtools-extension": "^2.13.8",
"redux-logger": "^3.0.6",
"webpack": "^4.35.3",
"webpack-async-chunk-names-plugin": "^0.1.1",
"webpack-bundle-analyzer": "^3.3.2",
"webpack-cli": "^3.3.5",
"webpack-dashboard": "^3.0.7",
"webpack-dev-server": "^3.7.2",
"webpack-merge": "^4.2.1"
},
"dependencies": {
"@material-ui/core": "^4.2.0",
"@material-ui/icons": "^4.2.1",
"clsx": "1.0.2",
"fg-loadcss": "^2.1.0",
"lodash": "^4.17.15",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-gradient": "^1.0.1",
"react-redux": "^7.1.0",
"react-router-dom": "^5.0.1",
"recharts": "^1.6.2",
"redux": "^4.0.4",
"redux-thunk": "^2.3.0"
}
}
jest.config.js
module.exports = {
"testRegex": "((\\.|/*.)(test))\\.js?$",
"transform": {
"^.+\\.(js|ts)x?$": "<rootDir>/node_modules/babel-jest"
}
}
babel.config.js
module.exports = function (api) {
api.cache(true)
const presets = [
["@babel/preset-env", {"modules": false}],
["@babel/preset-flow", {"all": true}],
"@babel/preset-react",
]
const plugins = [
"lodash",
"recharts",
//"@babel/plugin-proposal-class-properties",
["module-resolver", {
"root": ["./"],
"alias": {
"projectRoot": "./",
"src": "./src/",
},
}],
["transform-imports", {
"@material-ui/core": {
//supports only upto level 2 (@material-ui/core/Tabs/TabIndicator <- level 3 not supported)
"transform": "@material-ui/core/${member}",
},
}],
]
return {
presets,
plugins
}
}
我得到的错误
Details:
src/helpers/__tests__/utils.test.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import { getDateString, getTimeString } from "../utils";
^
SyntaxError: Unexpected token {
at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:579:25)
看到没有任何效果,这非常令人沮丧。到目前为止,我已经尝试了无数的事情,但它似乎不起作用。任何帮助将非常感激!
解决方案
从“../utils”导入 { getDateString, getTimeString };
这一行表明你的 babel 没有转译 es 模块语法
尝试module: 'cjs'
const presets = [
["@babel/preset-env", {"modules": 'cjs'}],
["@babel/preset-flow", {"all": true}],
"@babel/preset-react",
]
推荐阅读
- spring-boot - 热插拔不适用于 IntelliJ 中的 Spring Boot
- javascript - 对 Places 服务的所有请求都必须使用 https:// 协议,并包含 API 密钥
- wordpress-theming - 木材:如何在 archive.php 中查询单个自定义帖子类型的帖子
- r - 如何/在哪里将 tidycensus 变量与人口普查局变量匹配?
- android - “损坏的工具链:无法在 buildozer 中链接简单的 C 程序?” 尝试使用 kivy buildozer 制作 android 应用程序时
- api - 如何从命令行使用 curl 对 Akamai 源进行 API 调用
- .net - OpenIDConnect .Net 框架中的多租户
- git - 如何进行向后端口变基?
- jquery - 计算 Jquery 中的具体日期是哪一天?
- ruby - 访问实例的好方法是什么?