Vite 依赖预构建 — 缺失导出与页面反复刷新

现象

浏览器报 The requested module '/node_modules/.vite/deps/chunk-XXXX.js' does not provide an export named 'default'；页面因 “new dependencies optimized” 反复刷新；修改 workspace 包后仍解析到旧副本；某个 CommonJS 依赖只在开发模式失败，生产构建正常。

诊断

先清缓存并强制重启：

rm -rf node_modules/.vite
npx vite --force
npx vite --debug 2>&1 | grep -E "optimiz|deps|reload" | head -40

错误消失说明缓存过期是触发点，但配置仍需检查。调试日志会列出依赖发现、打包和触发刷新的过程；同一依赖在启动后再次被优化，通常意味着它是通过动态 import 或插件转换才被发现的。再用 npm ls react react-dom 检查是否存在两份框架副本，node_modules/.vite/deps 可查看实际预构建了哪些包。

修复

依赖变更后清理缓存；把无法静态发现的 CommonJS 或深层导入加入 include；把 workspace 链接包放入 exclude，让 Vite 直接读取源码；对共享框架启用 dedupe：

export default defineConfig({
  optimizeDeps: {
    include: ['lodash-es', 'some-cjs-lib'],
    exclude: ['@acme/ui'],
  },
  resolve: { dedupe: ['react', 'react-dom'] },
  server: {
    warmup: { clientFiles: ['./src/main.tsx', './src/routes/*.tsx'] },
  },
});

验证

重启后确认预构建只执行一次、页面不再循环刷新、原先缺失的具名导出能正常加载。修改链接包中的文件应触发 HMR 而不是整页重启。最后执行生产构建，确认开发期修复没有改变运行行为；仅开发环境存在的问题不应靠构建掩盖。