Vitest无法找到依赖模块文件问题求助

问题根源 #

Vite在开发/构建阶段会自动补全模块引用的文件后缀，但Vitest的默认解析规则对node_modules内部分依赖的无后缀引用支持不足，导致找不到实际存在的charAt.js文件。

解决思路 #

1. 明确配置文件解析后缀 #

在vitest.config.ts的resolve字段中添加extensions，明确列出需要自动补全的文件后缀，确保包含.js：

export default defineConfig({
   test: {
      environment: 'jsdom',
      threads: false,
      coverage: {
         provider: 'c8',
         reporter: ['text', 'json', 'html', 'lcov'],
         reportsDirectory: path.join(__dirname, 'analysis/coverage')
      }
   },

   resolve: {
      alias: ResolveAliases,
      // 新增：明确解析后缀，优先补全.js
      extensions: ['.js', '.ts', '.jsx', '.tsx', '.json']
   }
});

2. 强制预构建目标依赖 #

让Vitest对multibyte依赖进行预构建，确保模块引用被正确处理，在配置中添加optimizeDeps：

export default defineConfig({
   test: {
      environment: 'jsdom',
      threads: false,
      coverage: {
         provider: 'c8',
         reporter: ['text', 'json', 'html', 'lcov'],
         reportsDirectory: path.join(__dirname, 'analysis/coverage')
      }
   },

   resolve: {
      alias: ResolveAliases,
      extensions: ['.js', '.ts', '.jsx', '.tsx', '.json']
   },
   // 新增：预构建multibyte依赖
   optimizeDeps: {
      include: ['multibyte']
   }
});

3. 针对性映射缺失模块（兜底方案） #

如果上述方法无效，可以直接通过别名映射补全后缀，把无后缀的引用指向实际文件：

resolve: {
   alias: {
      ...ResolveAliases,
      // 精确映射依赖内的无后缀模块
      'multibyte/dist/esm/src/charAt': 'multibyte/dist/esm/src/charAt.js'
   },
   extensions: ['.js', '.ts', '.jsx', '.tsx', '.json']
}

4. 检查依赖本身的打包配置（若依赖是自己维护的） #

如果multibyte是你自己开发的依赖，需要调整其打包工具配置（比如Rollup/Vite），确保输出的ESM文件中，相对模块引用自动带上.js后缀，从根源避免问题。

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