单体仓库(Monorepo)搭建指南:从零开始
单体仓库(Monorepo)是一种将多个相关项目集中管理在一个仓库中的开发模式。它可以帮助开发者共享代码、统一配置,并简化依赖管理。本文将通过实际代码示例,详细介绍如何使用 pnpm 搭建一个单体仓库。
mkdir xxx && cd xxx
代码解析:
pnpm init
pnpm init
的功能类似于 npm init,用于初始化一个新的 Node.js 项目。它会引导你填写一些基本信息(如项目名称、版本、描述、作者等),并生成一个 package.json 文件。这个文件是项目的配置文件,用于定义项目的依赖、脚本和其他元数据。
代码解析:
{
"private": true, // monorepo 项目需要设置为私有
"type": "module", // 使用 ESM 模块系统
"workspaces": [
"packages/*" // 指定工作空间目录
]
}
代码解析:
mkdir packages
mkdir packages/editor
cd packages/editor
子项目的 package.json 示例:
{
"name": "@my-monorepo/editor", // 建议使用 @scope 形式命名
"version": "1.0.0",
"private": true,
"main": "index.ts",
"scripts": {
"dev": "vite",
"build": "tsc && vite build",
"start": "vite"
},
"dependencies": {
// 子项目特定的依赖
},
"devDependencies": {
// 子项目特定的开发依赖
},
"peerDependencies": {
// 如果这是一个库,指定同级依赖
"react": "^18.0.0",
"react-dom": "^18.0.0"
}
}
代码解析:
pnpm add -w package-name # 安装生产依赖
pnpm add -w -D package-name # 安装开发依赖
pnpm add package-name --filter @my-monorepo/editor # 安装生产依赖
pnpm add -D package-name --filter @my-monorepo/editor # 安装开发依赖
pnpm add package-name --filter "./packages/**" # 为所有子项目安装依赖
pnpm add @my-monorepo/shared --filter @my-monorepo/editor # editor 依赖 shared 包
{
"version": "workspace:*" // 使用工作空间协议,自动同步版本
}
共享配置文件
# 根目录创建共享配置
touch tsconfig.base.json
touch .eslintrc.js
{
"extends": "../../tsconfig.base.json",
"compilerOptions": {
"outDir": "./dist",
"rootDir": "./src"
}
}
{
"devDependencies": {
"typescript": "~5.6.2",
"vite": "^6.0.5",
"eslint": "^9.17.0",
"@types/node": "^22.10.3"
}
}
my-monorepo/
├── package.json
├── pnpm-workspace.yaml (可选)
├── tsconfig.base.json
├── .eslintrc.js
├── packages/
│ ├── editor/
│ │ ├── package.json
│ │ ├── tsconfig.json
│ │ └── src/
│ └── shared/
│ ├── package.json
│ ├── tsconfig.json
│ └── src/
解析:
这样的结构可以让您更好地管理多个相关项目,共享代码和配置,同时保持每个项目的独立性。通过 pnpm 的工作空间功能,你可以轻松地在子项目之间共享依赖和配置,提升开发效率。
希望这篇文章能帮助你快速搭建一个高效、灵活的单体仓库项目!