尝试设置jest和酶以在React.js项目上运行单元测试。只要我不需要目标组件中的node_module,此配置设置就可以正常工作。但是,如果我要测试的组件导入一个本身导入scss文件的node_module,则会抛出此错误:
import('../../scss/bulkAction.scss');
^^^^^^
SyntaxError: Unexpected token import
这是我的jest配置文件:
"jest": {
"testPathIgnorePatterns": [
"<rootDir>/(node_modules)"
],
"moduleFileExtensions": [
"js",
"jsx"
],
"moduleDirectories": [
"node_modules"
],
"moduleNameMapper": {
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/app/_tests_/config/fileMock.js",
"\\.(css|scss)$": "identity-obj-proxy"
},
"transform": {
"^.+\\.(js|jsx)$": "babel-jest",
"^.+\\.(css|scss)$": "<rootDir>/app/_tests_/config/scssTransform.js",
"^(?!.*\\.(js|jsx|json)$)": "<rootDir>/app/_tests_/config/fileTransform.js"
}
},
这是我的.babelrc文件
{
"presets": [
["es2015", {"modules": false}], "react", "stage-0"],
"env": {
"start": {
"presets": [
"react-hmre"
]
},
"test": {
"presets": ["es2015", "react", "stage-0"],
"plugins": ["transform-es2015-modules-commonjs"]
}
}
}
我尝试了多种不同的配置,并且已经阅读了很长时间的文档并且无法解决这个问题。我希望有人可以提供帮助!
请注意我们的文件结构:
/WebApps/ProjectName/ProjectFolder/app
/WebApps/ProjectName/ProjectFolder/package.json
/WebApps/ProjectName/ProjectFolder/.babelrc
/WebApps/ProjectName/ProjectFolder/node_modules
我添加这个只是因为文件路径可能是问题的一部分。
答案 0 :(得分:1)
你可能错过了transform-es2015-modules-commonjs
babel插件。
将此添加到您的.babelrc
// .babelrc
{
"presets": [
["es2015", {"modules": false}]
],
"env": {
"test": {
"plugins": ["transform-es2015-modules-commonjs"]
}
}
}
请记住在使用之前安装此插件:
babel-plugin-transform-es2015-modules-commonjs --save-dev
使用jest
运行测试时,默认情况下将环境设置为test
。
在我的项目中,我也使用identity-obj-proxy
,例如:
// jest.config.json
{
"moduleNameMapper": {
"\\.(css|scss)$": "identity-obj-proxy"
},
}
另外,首先在使用之前安装它:
npm install --save-dev identity-obj-proxy
我强烈建议您阅读有关使用webpack进行集成游戏的官方jest文档中的页面。