I couldn't get rid of this SyntaxError: Cannot use import statement outside a module
error no matter what I have tried and it got so frustrating.
Is there anybody out here solved this issue? I have read a million stackoverflow and github issue threads. No clear solutions.
The error I get is
Details:
/Users/brandi/Documents/workspaces/admin-v1/adminWebpack/vueSourceCode/test/__tests__/test.test.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,jest){import { shallowMount } from '@vue/test-utils';
^^^^^^
SyntaxError: Cannot use import statement outside a module
I have this setup:
jest.config.js
module.exports = {
moduleFileExtensions: [
'js', 'json', 'vue'
],
moduleNameMapper: {
'^~/(.*)$': '<rootDir>/vueSourceCode/$1',
'^@/(.*)$': '<rootDir>/vueSourceCode/$1'
},
modulePathIgnorePatterns: [
'<rootDir>/node_modules/',
'<rootDir>/build/',
'<rootDir>/config/'
],
transform: {
'^.+\\.js$': 'babel-jest',
'^[^.]+.vue$': 'vue-jest'
},
snapshotSerializers: [
'jest-serializer-vue'
],
testMatch: [
'<rootDir>/vueSourceCode/(tests/unit/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx))'
],
transformIgnorePatterns: [
'<rootDir>/node_modules/'
]
};
babelrc
{
"presets": [
"env",
"stage-2",
[
"@babel/preset-env",
{
"targets": {
"node": "current"
}
}
]
],
"env": {
"test": {
"plugins": [
"@babel/plugin-transform-modules-commonjs",
"@babel/plugin-transform-runtime"
]
}
},
"test": [
"jest"
]
}
Any idea on how to resolve this problem?