前端多项目放在一个仓库，常见的 Monorepo 模式就 3 种。先讲模式，再讲具体怎么创建。
一、前端 Monorepo 常见 3 种模式
模式 1：Workspaces（最常用、最轻量）
代表工具：
- pnpm workspaces
- yarn workspaces
特点：
- 自动软链依赖
- 统一管理 node_modules
- 配置简单，适合多数团队
典型结构：
repo/
apps/
web/
admin/
packages/
utils/
components/
pnpm-workspace.yaml
package.json
模式 2：Turborepo（大项目常用）
优势：
- 强大的构建缓存（节省大量时间）
- 并行任务
- 适合多项目、多团队协作
结构同上，但增加 turbo 配置：
repo/
turbo.json
模式 3：Nx（超大型工程使用）
特点：
- 更强治理：依赖图、构建策略
- 提供脚手架和代码生成器
- 更偏大型企业项目
适合复杂度最高的场景。
二、前端 Monorepo：如何从零创建？
下面教你最推荐、最通用、最简单的：
👉 pnpm workspaces +（可选 Turbo）
步骤 1：初始化仓库
mkdir my-monorepo
cd my-monorepo
pnpm init -y
步骤 2：创建 workspace 配置
新建 pnpm-workspace.yaml：
packages:
- "apps/*"
- "packages/*"
这句等于告诉 pnpm：
apps 和 packages 下所有子目录都是子项目。
步骤 3：创建子项目
创建 apps 目录：
mkdir -p apps/web
mkdir -p apps/admin
进入其中一个：
cd apps/web
pnpm init -y
步骤 4：创建共享模块
前端多项目放在一个仓库，常见的 Monorepo 模式就 3 种。先讲模式，再讲具体怎么创建。
一、前端 Monorepo 常见 3 种模式
模式 1：Workspaces（最常用、最轻量）
代表工具：
- pnpm workspaces
- yarn workspaces
特点：
- 自动软链依赖
- 统一管理 node_modules
- 配置简单，适合多数团队
典型结构：
repo/
apps/
web/
admin/
packages/
utils/
components/
pnpm-workspace.yaml
package.json
模式 2：Turborepo（大项目常用）
优势：
- 强大的构建缓存（节省大量时间）
- 并行任务
- 适合多项目、多团队协作
结构同上，但增加 turbo 配置：
repo/
turbo.json
模式 3：Nx（超大型工程使用）
特点：
- 更强治理：依赖图、构建策略
- 提供脚手架和代码生成器
- 更偏大型企业项目
适合复杂度最高的场景。
二、前端 Monorepo：如何从零创建？
下面教你最推荐、最通用、最简单的：
👉 pnpm workspaces +（可选 Turbo）
步骤 1：初始化仓库
mkdir my-monorepo
cd my-monorepo
pnpm init -y
步骤 2：创建 workspace 配置
新建 pnpm-workspace.yaml：
packages:
- "apps/*"
- "packages/*"
这句等于告诉 pnpm：
apps 和 packages 下所有子目录都是子项目。
步骤 3：创建子项目
创建 apps 目录：
mkdir -p apps/web
mkdir -p apps/admin
进入其中一个：
cd apps/web
pnpm init -y
步骤 4：创建共享模块
mkdir -p packages/utils
cd packages/utils
pnpm init -y
例如 packages/utils/index.js：
export const sum = (a, b) => a + b;
步骤 5：子项目引用共享模块
回到 apps/web：
pnpm add @repo/utils --workspace
使用：
import { sum } from "@repo/utils";
pnpm 会自动建立软链，不需要写相对路径。
步骤 6（可选）：加 Turborepo 优化构建
安装：
pnpm add -D turbo
创建 turbo.json：
{
"pipeline": {
"dev": {
"cache": false
},
"build": {
"outputs": ["dist/**"]
}
}
}
根目录 scripts 写法：
{
"scripts": {
"dev": "turbo run dev",
"build": "turbo run build"
}
}
现在所有 apps、packages 都能按依赖关系自动构建。
三、前端 Monorepo 推荐选型
| 团队规模 |
建议模式 |
| 1–5 人 |
pnpm workspaces |
| 5–20 人 |
pnpm + Turborepo |
| 20 人+、大量前端服务 |
Nx |
最简总结
前端 Monorepo 的正确落地方式：
- 模式选择：优先 pnpm workspaces，够用且简单
- 文件结构：
apps + packages 两层式
- 安装依赖：pnpm 自动软链
- 共享模块：放 packages
- 构建优化：大项目再加 Turborepo 或 Nx
