使用Vitest测试TypeScript文件失败，请求排查解决

我有一个包含名为“types”包的monorepo，在该包中已安装Vitest，想要测试src/marketplaces.ts文件：

import { z } from 'zod';

export const marketplaces = z.enum([
  'unitedStates',
  'unitedKingdom'
]);

但运行如下基础测试时失败：

import { expect, test } from 'vitest';
import { marketplaces } from './marketplaces';
test('should work', () => {
  expect(marketplaces).toBeDefined();
});

报错信息：

Failed to parse source for import analysis because the content contains invalid JS syntax. If you are using JSX, make sure to name the file with the .jsx or .tsx extension.

当前vitest.config.ts配置：

import { defineConfig } from 'vitest/config';

export default defineConfig({
  test: {
    include: ['src/**/*.{test,spec}.{js,ts}'],
  },
});

1. 确认TypeScript依赖与配置
   确保包内已安装typescript，未安装则执行：

   npm install typescript --save-dev
   

   同时在包根目录创建tsconfig.json，基础配置示例：

   {
     "compilerOptions": {
       "target": "ES2020",
       "module": "ESNext",
       "moduleResolution": "bundler",
       "strict": true,
       "esModuleInterop": true
     },
     "include": ["src/**/*"]
   }
   

2. 调整Vitest配置以支持TypeScript
   修改vitest.config.ts，添加Vite的基础解析配置，确保正确识别TS文件：

   import { defineConfig } from 'vitest/config';
   
   export default defineConfig({
     resolve: {
       extensions: ['.ts', '.js'],
     },
     test: {
       include: ['src/**/*.{test,spec}.{js,ts}'],
     },
   });
   

3. 检查测试文件命名规则
   确认测试文件名符合配置中的include规则，比如命名为marketplaces.test.ts或marketplaces.spec.ts，避免因文件名不匹配导致Vitest无法正确处理语法。

4. 排除JSX误判问题
   若Vite误将TS语法识别为JSX，可在配置中显式关闭JSX处理：

   import { defineConfig } from 'vitest/config';
   
   export default defineConfig({
     esbuild: {
       jsx: 'none',
     },
     test: {
       include: ['src/**/*.{test,spec}.{js,ts}'],
     },
   });
   

5. 更新zod依赖
   确保使用的zod版本支持z.enum语法，执行更新命令：

   npm update zod
   

内容的提问来源于stack exchange，提问作者Christian