Yarn Workspace依赖未在Vite缓存中更新的解决方法求助

问题场景 #

使用Yarn Workspaces管理项目，目录结构如下：

web/              # @my_app workspace
  frontend/       # @my_app/frontend workspace
    App.tsx
    node_modules/
      .vite/      # Vite缓存目录
  backend/
  shared/
    foo.ts

前端项目引入shared/foo.ts的常量后，在foo.ts新增export const bar = 1并尝试在App.tsx中导入，运行vite时出现报错：

Uncaught SyntaxError: The requested module '/node_modules/.vite/deps/@my_app_foo.js?v=cccdb61c' does not provide an export named 'bar' (at App.tsx)

检查发现/node_modules/.vite/deps/@my_app_foo.js未同步最新修改，需要实现启动Vite时自动更新缓存（无需热重载）。

解决方案 #

1. 启动时强制清除缓存 #

直接在启动命令中添加--force参数，强制Vite清除现有缓存并重新生成：

vite --force

可将该命令写入package.json的scripts中，方便后续调用：

{
  "scripts": {
    "dev": "vite --force"
  }
}

2. 通过Vite配置强制重新优化依赖 #

在vite.config.ts中设置optimizeDeps.force为true，每次启动Vite都会重新优化依赖，确保缓存内容为最新版本：

import { defineConfig } from 'vite';

export default defineConfig({
  optimizeDeps: {
    force: true
  }
});

3. 手动清除缓存目录 #

如果上述方法不生效，可直接删除Vite缓存目录，再启动服务生成新缓存：

rm -rf frontend/node_modules/.vite

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