我现在要花几天时间来运行我的测试设置。大致轮廓：Vite，Svelte(带ts(，Jest。
我使用import.meta.env.SOMENAME作为我的环境变量，尽管这对开发来说很好，只要组件使用import.meta.env，测试就会失败：
SyntaxError:无法在模块外部使用"import.meta">
我尝试过不同的转换器、babel插件和配置，但从未成功。。。
我的笑话配置：
"jest": {
"globals": {
"ts-jest": {
"isolatedModules": true
}
},
"verbose": true,
"transform": {
"^.+\.svelte$": [
"svelte-jester",
{
"preprocess": true
}
],
"^.+\.ts$": "ts-jest",
"^.+\.js$": "babel-jest"
},
"setupFilesAfterEnv": ["<rootDir>/setupTests.ts"],
"moduleFileExtensions": ["js", "ts", "svelte"]
}
babel.config.js
module.exports = {
presets: [
[
"@babel/preset-env",
{
targets: {
node: "current"
}
}
]
]
};
svelt.config.js
const sveltePreprocess = require('svelte-preprocess')
module.exports = {
emitCss: true,
preprocess: sveltePreprocess()
};
除此之外，我尝试使用@babel/plugin-syntax-import-meta，但最终出现了相同的错误。同样，这个玩笑看起来很有希望，但我还是没能成功。
我很感激能得到的每一个暗示。如果我能提供任何其他信息，请告诉我。此外，我对vite和babel的了解非常有限，所以非常感谢IU在这个话题上能提供的任何帮助。
更新(解决方案(
所以如果你使用babel，你可以使用babel预设的vite。Apu中的esbuild-jest方法也是许多人使用的很好的解决方案。不幸的是，这些东西对我来说不起作用，所以我决定使用vite定义的变通方法。
此解决方法包括两个步骤。
- 用
process.env替换import.meta.env(如果这对你来说是一个破坏交易的因素，那么我希望你在上面的解决方案中运气好(你只需要用jest替换你想要测试的文件中的实例 - 使用define更新Vite-config。这一步骤是必要的，否则您的构建将中断(开发仍将工作(
vite.config.js
const dotEnvConfig = dotenv.config();
export default defineConfig({
define: {
"process.env.NODE_ENV": `"${process.env.NODE_ENV}"`,
"process.env.VITE_APP_SOMENAME": `"${process.env.VITE_APP_SOMENAME}"`
},
...
)};
我知道这只是一个变通办法，但也许这对某人有所帮助。谢谢&祝你好运
了解import.meta.env的Jest的最新替代方案是Vitest。
它应该几乎不需要额外的配置就可以开始了，而且它与Jest高度兼容，所以它几乎不需要对实际测试进行更改。
在这个用例中，Vitest相对于Jest的优势是：
- 它是专门为Vite设计的，将根据需要处理测试
- 它将重用您现有的Vite配置：
- 任何
define变量都将按预期替换 - Vite添加到
import.meta的扩展将照常可用
- 任何
我在使用jest进行svelte组件测试时遇到了问题。babel不善于分辨CCD_ 8。我使用esbuild-jest来转换ts和js文件。它用import.meta解决了这个问题。这是我的jost.config.js.
npm i esbuild esbuild-jest -D
const { pathsToModuleNameMapper } = require('ts-jest/utils');
const { compilerOptions } = require('./tsconfig');
const config = {
"transform": {
"^.+\.svelte$": [
"svelte-jester",
{
"preprocess": true
}
],
"^.+\.(ts|tsx|js|jsx)$": ["esbuild-jest"]
},
"moduleFileExtensions": [
"js",
"ts",
"tsx",
"svelte"
],
"setupFilesAfterEnv": [
"@testing-library/jest-dom/extend-expect"
],
"collectCoverageFrom": [
"**/*.(t|j)s",
"**/*.svelte"
],
coverageProvider: 'v8',
"coverageDirectory": "./coverage",
"coveragePathIgnorePatterns": [
"/node_modules/",
"/.svelte-kit/"
],
"moduleNameMapper": pathsToModuleNameMapper(compilerOptions.paths, {prefix: '<rootDir>/'})
};
module.exports = config;