使用 TypeScript 的 Monorepo：初学者代码组织指南

使用 TypeScript 的 Monorepo：初学者代码组织指南

使用 TypeScript 开发现代应用程序通常需要管理多个相互关联的包（例如，组件库、后端服务和工具库）。与其将每个包存放在单独的仓库（多仓库）中，许多团队选择 Monorepo——一个包含所有项目的单一仓库。在本文中，我们将介绍如何组织使用 TypeScript 的 Monorepo，即使您是初学者。

什么是 Monorepo，为什么需要它？

Monorepo 是一种将多个项目（包、模块）的代码存储在一个仓库中的方法。这并不意味着所有项目都混为一谈：它们在逻辑上仍然是分离的，但处于同一管理之下。

对于 TypeScript 项目的优势：

• 统一的依赖版本。 您可以避免不同包中使用不同版本的 TypeScript 或同一库的情况。
• 简单的重构。 在一个地方更改公共接口或类型会立即更新所有依赖包。
• 简化的发布。 Monorepo 工具（例如 Lerna 或 Nx）有助于自动仅发布已更改的包。
• 共享配置。 您可以为所有包拥有一个 tsconfig.json，并在需要时覆盖它。

创建 Monorepo 的工具

有几种流行的工具可用于在 TypeScript 中使用 Monorepo：

• npm Workspaces — 从版本 7 开始，npm 内置的功能。简单且高效。
• Yarn Workspaces — Yarn 包管理器中的类似功能。
• Lerna — 经典工具，通常与 npm 或 Yarn Workspaces 一起使用。
• Nx — 强大的 Monorepo 系统，具有高级缓存和代码生成功能。
• Turborepo — Vercel 的现代工具，专注于速度和简单性。

在本指南中，我们将使用 npm Workspaces，因为它是最简单的方法，不需要安装额外的全局工具。

使用 TypeScript 逐步设置 Monorepo

1. 创建根目录结构

首先创建 Monorepo 的根文件夹并初始化 package.json：

mkdir my-monorepocd my-monoreponpm init -y

现在编辑根目录的 package.json，添加 workspaces 字段。这将告诉 npm 在哪里找到您的包：

{  "name": "my-monorepo",  "private": true,  "workspaces": [    "packages/*"  ]}

"private": true 标志可防止根包意外发布到 npm。

2. 创建包

为您的包创建文件夹结构。典型结构如下：

my-monorepo/├── packages/│   ├── utils/          # 通用工具库│   ├── ui/             # 组件库│   └── backend/        # 服务器应用程序├── package.json└── tsconfig.json

创建 packages 文件夹，并在其中为每个包创建文件夹。每个包都应该有自己的 package.json。例如，对于 utils 包：

mkdir -p packages/utilscd packages/utilsnpm init -y

编辑 packages/utils/package.json，添加名称和可能的版本：

{  "name": "@my-project/utils",  "version": "1.0.0",  "main": "dist/index.js",  "types": "dist/index.