单体仓库管理

构建高效、可扩展的单体仓库，实现跨多个包和应用程序的代码共享、一致的工具链和原子化变更。

何时使用此技能

• - 搭建新的单体仓库项目
• 从多仓库迁移到单体仓库
• 优化构建和测试性能
• 管理共享依赖
• 实施代码共享策略
• 为单体仓库配置CI/CD
• 版本管理和发布包
• 调试单体仓库特有的问题

核心概念

1. 为什么选择单体仓库？

优势：

• - 共享代码和依赖
• 跨项目的原子化提交
• 一致的工具链和标准
• 更易重构
• 简化的依赖管理
• 更好的代码可见性

挑战：

• - 大规模构建性能
• CI/CD复杂性
• 访问控制
• 大型Git仓库

2. 单体仓库工具

包管理器：

• - pnpm工作空间（推荐）
• npm工作空间
• Yarn工作空间

构建系统：

• - Turborepo（大多数场景推荐）
• Nx（功能丰富，复杂）
• Lerna（较旧，维护模式）

Turborepo设置

初始设置

bash

创建新的单体仓库

npx create-turbo@latest my-monorepo
cd my-monorepo

结构：

apps/

web/ - Next.js应用

docs/ - 文档站点

packages/

ui/ - 共享UI组件

config/ - 共享配置

tsconfig/ - 共享TypeScript配置

turbo.json - Turborepo配置

package.json - 根package.json

配置

json
// turbo.json
{
$schema: https://turbo.build/schema.json,
globalDependencies: [/.env.*local],
pipeline: {
build: {
dependsOn: [^build],
outputs: [dist/, .next/, !.next/cache/]
},
test: {
dependsOn: [build],
outputs: [coverage/]
},
lint: {
outputs: []
},
dev: {
cache: false,
persistent: true
},
type-check: {
dependsOn: [^build],
outputs: []
}
}
}

json
// package.json（根目录）
{
name: my-monorepo,
private: true,
workspaces: [apps/, packages/],
scripts: {
build: turbo run build,
dev: turbo run dev,
test: turbo run test,
lint: turbo run lint,
format: prettier --write \/*.{ts,tsx,md}\,
clean: turbo run clean && rm -rf node_modules
},
devDependencies: {
turbo: ^1.10.0,
prettier: ^3.0.0,
typescript: ^5.0.0
},
packageManager: pnpm@8.0.0
}

包结构

json
// packages/ui/package.json
{
name: @repo/ui,
version: 0.0.0,
private: true,
main: ./dist/index.js,
types: ./dist/index.d.ts,
exports: {
.: {
import: ./dist/index.js,
types: ./dist/index.d.ts
},
./button: {
import: ./dist/button.js,
types: ./dist/button.d.ts
}
},
scripts: {
build: tsup src/index.ts --format esm,cjs --dts,
dev: tsup src/index.ts --format esm,cjs --dts --watch,
lint: eslint src/,
type-check: tsc --noEmit
},
devDependencies: {
@repo/tsconfig: workspace:*,
tsup: ^7.0.0,
typescript: ^5.0.0
},
dependencies: {
react: ^18.2.0
}
}

pnpm工作空间

设置

yaml

pnpm-workspace.yaml

packages:
- apps/*
- packages/*
- tools/*

json
// .npmrc

提升共享依赖

shamefully-hoist=true

严格对等依赖

auto-install-peers=true strict-peer-dependencies=true

性能

store-dir=~/.pnpm-store

依赖管理

bash

在特定包中安装依赖

pnpm add react --filter @repo/ui
pnpm add -D typescript --filter @repo/ui

安装工作空间依赖

pnpm add @repo/ui --filter web

在所有包中安装

pnpm add -D eslint -w

更新所有依赖

pnpm update -r

移除依赖

pnpm remove react --filter @repo/ui

脚本

bash

在特定包中运行脚本

pnpm --filter web dev
pnpm --filter @repo/ui build

在所有包中运行

pnpm -r build pnpm -r test

并行运行

pnpm -r --parallel dev

按模式过滤

pnpm --filter @repo/* build pnpm --filter ...web build # 构建web及其依赖

Nx单体仓库

设置

bash

创建Nx单体仓库

npx create-nx-workspace@latest my-org

生成应用程序

nx generate @nx/react:app my-app nx generate @nx/next:app my-next-app

生成库

nx generate @nx/react:lib ui-components nx generate @nx/js:lib utils

配置

json
// nx.json
{
extends: nx/presets/npm.json,
$schema: ./node_modules/nx/schemas/nx-schema.json,
targetDefaults: {
build: {
dependsOn: [^build],
inputs: [production, ^production],
cache: true
},
test: {
inputs: [default, ^production, {workspaceRoot}/jest.preset.js],
cache: true
},
lint: {
inputs: [default, {workspaceRoot}/.eslintrc.json],
cache: true
}
},
namedInputs: {
default: [{projectRoot}//*, sharedGlobals],
production: [
default,
!{projectRoot}//?(*.)+(spec|test).[jt]s?(x)?(.snap),
!{projectRoot}/tsconfig.spec.json
],
sharedGlobals: []
}
}

运行任务

bash

为特定项目运行任务

nx build my-app
nx test ui-components
nx lint utils

为受影响的项目运行

nx affected:build nx affected:test --base=main

可视化依赖关系

nx graph

并行运行

nx run-many --target=build --all --parallel=3

共享配置

TypeScript配置

json
// packages/tsconfig/base.json
{
compilerOptions: {
strict: true,
esModuleInterop: true,
skipLibCheck: true,
forceConsistentCasingInFileNames: true,
module: ESNext,
moduleResolution: bundler,
resolveJsonModule: true,
isolatedModules: true,
incremental: true,
declaration: true
},
exclude: [node_modules]
}

// packages/tsconfig/react.json
{
extends: ./base.json,
compilerOptions: {
jsx: react-jsx,
lib: [ES2022, DOM, DOM.Iterable]
}
}

// apps/web/tsconfig.json
{
extends: @repo/tsconfig/react.json,
compilerOptions: {
outDir: dist,
rootDir: src
},
include: [src],
exclude: [node_modules, dist]
}

ESLint配置

javascript
// packages/config/eslint-preset.js
module.exports = {
extends: [
eslint:recommended,
plugin:@typescript-eslint/recommended,
plugin:react/re