pnpm + monorepo + Turborepo 管理多项目

pnpm 管依赖。
monorepo 管项目放在哪里。
Turborepo 管任务怎么跑。

one-repo/
  apps/admin/
  apps/website/
  packages/utils/
  pnpm-workspace.yaml
  turbo.json

repo-admin/
repo-website/
repo-utils/

projects/
  admin/
  website/
  ai/

root/
  apps/
  packages/
  package.json
  pnpm-workspace.yaml
  pnpm-lock.yaml

monorepo = 一栋办公楼
pnpm workspace = 楼里的通讯录和仓库钥匙
Turborepo = 楼里的任务调度员

frontend-admin/
frontend-ai/
frontend-website/

zero-one/
  frontend-admin/
    package.json
    pnpm-lock.yaml
  frontend-ai/
    package.json
    pnpm-lock.yaml
  frontend-website/
    package.json
    pnpm-lock.yaml

zero-one/
  apps/
    admin/
    ai/
    website/
  packages/
    utils/
    request/
    ui/
  package.json
  pnpm-workspace.yaml
  pnpm-lock.yaml

packages:
  - "apps/*"
  - "packages/*"

apps/ 下面都是应用。
packages/ 下面都是共享包。
这些目录共同组成一个 workspace。

读取 package.json
安装 dependencies
生成 pnpm-lock.yaml
让项目可以 import 第三方包

packages/utils/
  package.json
  src/index.ts

{
  "name": "@zero-one/utils",
  "version": "0.0.0",
  "private": true,
  "type": "module",
  "main": "./src/index.ts",
  "types": "./src/index.ts"
}

{
  "dependencies": {
    "@zero-one/utils": "workspace:*"
  }
}

不要去 npm 远程仓库找 @zero-one/utils。
直接使用当前 workspace 里的 packages/utils。

import { formatDate } from "@zero-one/utils";

const text = formatDate(new Date());

共享代码不用复制。
共享代码也不用先发布到 npm。
本地改了共享包，业务项目能直接用。

apps/admin       # 后台
apps/website     # 官网
packages/utils   # 公共工具包
packages/ui      # 公共 UI 包

admin   -> ui -> utils
website -> ui -> utils

pnpm build

packages/utils build
        ↓
packages/ui build
        ↓
apps/admin build
apps/website build

同一个仓库里有很多任务。
我帮你判断哪些任务要跑、按什么顺序跑、哪些可以跳过。

pnpm install

pnpm --filter website dev

pnpm turbo build

mkdir my-monorepo
cd my-monorepo
pnpm init

my-monorepo/
  apps/
    website/
    admin/
  packages/
    utils/

packages:
  - "apps/*"
  - "packages/*"

{
  "name": "@my-project/utils",
  "version": "0.0.0",
  "private": true,
  "type": "module",
  "main": "./src/index.ts",
  "types": "./src/index.ts"
}

export function formatTitle(title: string) {
  return title.trim().replace(/\s+/g, " ");
}

{
  "name": "website",
  "private": true,
  "scripts": {
    "dev": "vite --host 0.0.0.0 --port 3000",
    "build": "vite build",
    "lint": "eslint .",
    "typecheck": "vue-tsc --noEmit"
  },
  "dependencies": {
    "@my-project/utils": "workspace:*"
  }
}

pnpm install

pnpm --filter website dev

pnpm -r build

pnpm add -D turbo -w

{
  "tasks": {
    "build": {
      "dependsOn": ["^build"],
      "outputs": ["dist/**", ".output/**", ".nuxt/**"]
    },
    "dev": {
      "cache": false,
      "persistent": true
    },
    "lint": {},
    "typecheck": {}
  }
}

{
  "private": true,
  "scripts": {
    "dev": "turbo dev",
    "build": "turbo build",
    "lint": "turbo lint",
    "typecheck": "turbo typecheck"
  },
  "devDependencies": {
    "turbo": "^2.0.0"
  }
}

pnpm build
pnpm lint
pnpm typecheck

pnpm turbo build --filter=website

pnpm turbo build --filter=website...

my-monorepo/
  apps/
    website/
      package.json
    admin/
      package.json
    ai/
      package.json
  packages/
    utils/
      package.json
    request/
      package.json
    ui/
      package.json
  package.json
  pnpm-workspace.yaml
  pnpm-lock.yaml
  turbo.json

先放进 apps/
再统一 workspace
观察重复代码
稳定复用后再抽 packages/
任务变多后再接 Turbo

zero-one/
  frontend-website/     # 公开网站项目，也就是 /learn 展示文章的项目
  frontend-zero-ai/     # AI 应用前端项目
  frontend-zero-bi/     # BI 数据分析前端项目
  frontend-react/       # React 版本前端项目或实验项目
  frontend-vue/         # Vue 管理端项目
  backend/              # 后端服务项目

多个项目放在同一个仓库下，
每个前端项目自己管理一套 pnpm workspace。

packages:
  - "frontend-website"
  - "frontend-zero-ai"
  - "frontend-zero-bi"
  - "frontend-react"
  - "frontend-vue"

{
  "name": "frontend-website",
  "private": true,
  "scripts": {
    "dev": "...",
    "build": "...",
    "typecheck": "..."
  }
}

packages/
  shared/
  utils/
  request/

至少两个项目稳定复用，
而且复制维护已经开始烦了，
再抽成 package。

packages/ui/

{
  "dependencies": {
    "@zero-one/ui": "workspace:*"
  }
}

Turborepo 是加速器，不是地基。

目录清楚
项目名清楚
依赖关系清楚
脚本命令清楚

{
  "dependencies": {
    "@zero-one/utils": "^1.0.0"
  }
}

{
  "dependencies": {
    "@zero-one/utils": "workspace:*"
  }
}

{
  "outputs": ["dist/**", ".output/**", ".nuxt/**"]
}

重复出现 2 次，可以先观察。
重复出现 3 次，而且改起来烦，再抽。

先 workspace
再统一 scripts
再抽共享包
再接 turbo
最后优化 CI

整理目录
统一项目名
统一 scripts
增加 pnpm-workspace.yaml
确认每个项目还能单独启动
抽第一个 packages/utils
再接入 turbo.json

先判断多个项目有没有共享和统一管理的需要。
有需要，再用 monorepo 把项目组织起来。
然后用 pnpm workspace 把依赖关系管清楚。
等任务变多、变慢，再用 Turborepo 把任务跑聪明。