I have a problem with configurations of Babel 7, Webpack 4 and Jest. While I'm running tests I'm getting following error:
SyntaxError: Cannot use import statement outside a module
package.json
"@babel/core": "^7.7.5",
"@babel/highlight": "^7.8.3",
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
"@babel/preset-env": "^7.8.4",
"babel-core": "^7.0.0-bridge.0",
"babel-loader": "^7.1.5",
"@babel/plugin-transform-runtime": "^7.7.4",
"@babel/preset-react": "^7.7.4",
"@babel/runtime": "^7.8.4",
"babel-jest": "^24.9.0",
"jest-watch-typeahead": "^0.4.2",
"vue-jest": "^3.0.5",
"jest": "^24.9.0",
"jest-serializer-vue": "^2.0.2",
"jest-transform-stub": "^2.0.0",
webpack.config.js
entry: {
app: ["./src/index.js"]
},
output: {
path: path.resolve('../', 'static/js/'),
filename: "[name].js",
publicPath: '/static/js/',
chunkFilename: '[name].chunk.js'
},
.babelrc - I assumed that the problem is with module: false but if I dont include that, webpack doesnt chunk my files.
{
"presets": [
["@babel/preset-env", {"modules": false}, "jest" ]
],
"plugins": [
"@babel/plugin-syntax-dynamic-import"
],
"env": {
"test": {
"plugins": ["@babel/plugin-transform-runtime"],
}
}
}
When I removed module: false tests were running, are there any chances to dont include module: false into tests?
From the Babel Options documentation:
Note: env[envKey] options will be merged on top of the options specified in the root object.
So you can apply modules: "auto"
during testing by redeclaring the plugin in the env.test
object:
{
"presets": [
[
"@babel/preset-env",
{
"modules": false
},
"jest"
]
],
"plugins": [
"@babel/plugin-syntax-dynamic-import"
],
"env": {
"test": {
"presets": [
[
"@babel/preset-env",
{
"modules": "auto"
},
"jest"
]
],
"plugins": [
"@babel/plugin-transform-runtime"
]
}
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With