vite 配置多个微应用独立打包部署的核心是通过多入口能力、按 app 划分目录结构、动态读取命令行参数切换构建目标，实现代码共管、构建分离、部署独立；每个微应用拥有独立 html、main.ts、app.vue 和 public 目录，共享 src/shared 或 src/lib 中的公共逻辑，vite.config.ts 动态设置 root 和 input，build.outdir 按 app 分离产物，base 设为相对路径，tsconfig.json 和 vite 插件统一配置。
用 Vite 配置多个微应用独立打包部署，核心是让每个微应用拥有自己的入口、构建上下文和输出路径，同时共享基础依赖与开发体验。不是靠“微前端框架”实现运行时隔离，而是通过 Vite 的多入口能力 + 目录结构 + 构建脚本，做到代码共管、构建分离、部署独立。
目录结构按微应用划分
每个微应用应有完整独立的运行单元：HTML 模板、主入口（main.ts）、根组件（App.vue）、静态资源（public），避免跨应用引用 src 下公共逻辑造成耦合。
- 把每个微应用放在独立子目录下，例如 src/apps/admin、src/apps/user、src/apps/finance
- 每个子目录内包含：
index.html、main.ts、App.vue、public/（可选） - 全局复用逻辑（如工具函数、类型定义、请求封装）统一放在 src/shared 或 src/lib，通过路径别名导入，不直接跨 app 引用
vite.config.ts 动态识别当前微应用
配置文件需支持根据命令行参数自动切换构建目标，而不是写死多个 config 文件。
- 读取 npm 脚本传入的 app 名称，例如
npm run build -- --app=admin - 使用
loadEnv或process.argv提取参数，确定root和build.rollupOptions.input -
root设为对应 app 目录（如./src/apps/admin），使开发服务器以该目录为根，index.html可被正确解析 -
input显式指定该 app 的 HTML 入口，确保 Rollup 只打包它，不污染其他 app 的产物
package.json 中定义独立构建脚本
每个微应用对应一组 dev / build 命令，互不影响，便于 CI/CD 分别触发。
- 开发命令示例：
"dev:admin": "vite --config vite.config.ts --app=admin" - 构建命令示例：
"build:admin": "vue-tsc && vite build --app=admin" - 构建后产物默认输出到
dist，但可通过build.outDir按 app 分离，如dist/admin、dist/user - 配合
base设置为相对路径（如/admin/），确保部署到子路径时资源加载正常
共享类型与构建一致性
多个微应用共用同一份 TypeScript 配置和类型定义，避免类型冲突或重复声明。
-
tsconfig.json放在项目根目录，所有 app 共享；include覆盖src/**/*和各 app 目录 - 全局类型（如
APIResponse、RouterMeta）统一定义在src/types，各 app 通过@/types导入 - Vite 插件（如
@vitejs/plugin-vue、vite-plugin-pages）在 config 中统一启用，不因 app 不同而增减 - 若需差异化行为（如不同 app 使用不同主题变量），可用环境变量控制，而非拆 config
