After adding the environment variable import.meta.env.VITE_*
in my code, the tests with vue-test-utils started to fail, with the error:
Jest suite failed to run
error TS1343: The 'import.meta' meta-property is only allowed when the '--module' option is 'es2020', 'es2022', 'esnext', 'system', 'node12', or 'nodenext'.
I have searched for some available fixes but none have worked so far.
EDIT
jest.config.js file:
module.exports = {
preset: "ts-jest",
globals: {},
testEnvironment: "jsdom",
transform: {
"^.+\\.vue$": "@vue/vue3-jest",
"^.+\\js$": "babel-jest"
},
moduleFileExtensions: ["vue", "js", "json", "jsx", "ts", "tsx", "node"],
moduleNameMapper: {
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":
"<rootDir>/tests/unit/__mocks__/fileMock.js",
"^@/(.*)$": "<rootDir>/src/$1"
}
}
tsconfig.json file:
{
"extends": "@vue/tsconfig/tsconfig.web.json",
"include": ["env.d.ts", "src/**/*", "src/**/*.vue", "tests"],
"compilerOptions": {
"module": "esnext",
"experimentalDecorators": true,
"baseUrl": ".",
"paths": {
"@/*": ["./src/*"]
}
},
"references": [
{
"path": "./tsconfig.vite-config.json"
}
]
}
When including module: "esnext"
, the warning below is displayed and the error remains.
Validation Warning:
Unknown option "module" with value "commonjs" was found. This is probably a typing mistake. Fixing it will remove this message.
Configuration Documentation: https://jestjs.io/docs/configuration
After much research, I was able to solve the case.
I had to install the vite-plugin-environment
and babel-plugin-transform-import-meta
libraries and make the following settings:
babel.config.js
module.exports = {
...
plugins: ["babel-plugin-transform-import-meta"]
}
tsonfig.json
{
...
"compilerOptions": {
"module": "esnext",
...
"types": [
"node"
]
},
...
}
vite.config.ts
...
import EnvironmentPlugin from "vite-plugin-environment"
...
export default defineConfig({
plugins: [..., EnvironmentPlugin("all")],
...
})
Also change the import.meta.env.*
to process.env.*