前端工程化实践：Monorepo与Lerna管理

前端工程化实践中，Monorepo（单仓库）管理和Lerna是两种流行的方式，用于大型项目或组件库的组织和版本管理。

2500G计算机入门到高级架构师开发资料超级大礼包免费送！

Monorepo简介

Monorepo（单仓库）是指在一个Git仓库中管理多个相关项目的开发方式。这种方式的优点在于：

集中式管理：所有项目都在一个仓库中，方便代码共享、版本同步和协同开发。
模块化：可以创建独立的模块，方便复用和维护。
统一的CI/CD：一次配置，全仓库生效，简化持续集成和部署流程。
更好的依赖管理：可以更容易地管理项目间的依赖关系。

Lerna简介

Lerna是一个命令行工具，用于在Monorepo中管理多包项目。它提供了版本管理和发布功能，使得在单个仓库中管理多个npm包变得简单。

Lerna的核心概念有：

Packages：Monorepo中的独立npm包。
Versions：每个包可以有自己的版本，可以是固定的或共享的。
Bootstrapping：初始化所有包的依赖关系，确保每个包都能正常工作。
Publishing：发布包到npm，可以是逐个包发布，也可以是批量发布。

安装Lerna

首先，确保安装Node.js和npm。然后，在项目根目录安装Lerna：

npm install --save-dev lerna
# 或
yarn add --dev lerna

初始化Lerna项目

在项目根目录运行以下命令初始化Lerna：

npx lerna init

这将创建一个lerna.json配置文件和一个packages目录，用于存放各个包。

创建和管理包

在packages目录下创建新包：

mkdir packages/my-package
cd packages/my-package
npm init -y
# 或
yarn init -y

在包内编写代码，例如index.js和package.json。

使用Lerna命令

Bootstrap：初始化所有包的依赖关系。

  npx lerna bootstrap

Add：在包之间添加依赖。

  npx lerna add @scope/my-package

Publish：发布包到npm。

  npx lerna publish

List：查看项目中的包。

  npx lerna ls

Lerna配置

在lerna.json中，可以配置Lerna的行为，例如：

{"version": "independent", // 或 "fixed""packages": ["packages/*"],"command": {"publish": {"ignore": ["**/node_modules/**"]}}
}

version：指定版本策略，可以是fixed（所有包共享同一版本号）或independent（每个包有自己的版本号）。
packages：指定包含包的目录路径。
command.publish.ignore：在发布时忽略的文件或目录。

性能优化

独立版本：使用independent版本策略，可以单独发布每个包，避免不必要的发布。
Selective Publishing：使用–since或–scope参数，只发布更改的包。
Workspaces：配合Yarn Workspaces使用，减少安装时间和磁盘空间占用。

Lerna的高级特性

异步操作和锁定

Lerna支持异步操作，这在处理大型项目时非常有用。在lerna.json中设置concurrency属性可以限制并发执行的任务数量，防止资源过度消耗。

{"concurrency": 4
}

Lerna还使用npm的package-lock.json或yarn.lock文件来确保每次安装时的依赖一致性。当lerna bootstrap执行时，它会按照文件中的锁定版本安装依赖，保证所有开发者在本地构建时使用相同的依赖版本。

自定义脚本

Lerna允许在lerna.json中定义自定义脚本，以便在项目中执行特定任务。例如，创建一个预发布脚本：

{"scripts": {"prepublishOnly": "tsc"}
}

这将在发布包之前运行TypeScript编译器。

工作流集成

Lerna可以与常见的CI/CD工具（如Jenkins、CircleCI、GitHub Actions等）集成，实现自动化测试、构建和发布。在.gitlab-ci.yml、.travis.yml或其他CI配置文件中，配置相应的Lerna命令。

例如，在GitHub Actions中：

name: CIon:push:branches: [ main ]jobs:build-and-test:runs-on: ubuntu-lateststeps:- uses: actions/checkout@v2- name: Install Dependenciesrun: npm ci- name: Bootstrap Lernarun: npm run bootstrap- name: Run Testsrun: npm test- name: Publishif: startsWith(github.ref, 'refs/tags')run: npx lerna publish from-git --yes