pnpm、lerna+yarn如何选择

简介: 本文适合对主流的包管理工具有所了解的小伙伴。

一、前言


本文基于开源项目:

https://github.com/pnpm/pnpm

https://github.com/lerna/lerna

   主流的包管理工具有pnpm、npm、yarn,lerna有小伙伴用过吗?


1.1 什么是lerna?

   Lerna 是一个管理多个 npm 模块的工具,是 Babel 自己用来维护自己的 Monorepo 并开源出的一个项目。优化维护多包的工作流,解决多个包互相依赖,且发布需要手动维护多个包的问题,可以优化使用git和npm管理多包存储库的工作流程。


1.2 pnpm有哪些特点?

pnpm火了好一阵子,我们来看看它以下的特点

  • 速度快绝多大数场景下,速度会比 npm/yarn 快 2-3 倍
  • 高效利用磁盘空间内部文件node_modules是从单个可寻址内容的存储链接的
  • 支持 monorepo用一个 git 仓库来管理多个子项目package
  • 严格程序包只能访问其中指定的依赖项package.json
  • 确定性一个名为的锁定文件pnpm-lock.yaml

接下来,我们讲讲这两种包管理工具的使用。


二、lerna


  lerna默认将软件包列表初始化为["packages/*"],如下所示:

录结构如下:
packages/
├── foo-pkg
│   └── package.json
├── bar-pkg
│   └── package.json
├── baz-pkg
│   └── package.json
└── qux-pkg
    └── package.json


2.1 安装lerna

 由于lerna会经常使用到,所以这里可以采用全局安装

npm i -g lerna


2.2 初始化项目

lerna init


初始化完项目后,我们可以看到package.json &lerna.json如下所示:


// package.json
{
"name": "root",
"private": true, // 私有的,不会被发布,是管理整个项目,与要发布到npm的解耦
"devDependencies": {
"lerna": "^3.15.0"
}
}
// lerna.json
{
"packages": [
"packages/*"
],
"version": "0.0.0"
}


2.3 创建npm包

增加两个包@mo-demo/cli  @mo-demo/cli-shared-utils

lerna create @mo-demo/cli
lerna create @mo-demo/cli-shared-utils


2.4 增加模块依赖

分别给相应的 package 增加依赖模块

lerna add chalk // 为所有 package 增加 chalk 模块
lerna add semver --scope @mo-demo/cli-shared-utils // 为 @mo-demo/cli-shared-utils 增加 semver 模块
lerna add @mo-demo/cli-shared-utils --scope @mo-demo/cli // 增加内部模块之间的依赖


2.5 发布

lerna publish


2.6 依赖包管理

我们使用 --hoist 来把每个 package 下的依赖包都提升到工程根目录,来降低安装以及管理的成本

lerna bootstrap --hoist


为了省去每次都输入 --hoist 参数的麻烦,可以在 lerna.json 配置:

{
  "packages": [
    "packages/*"
  ],
  "command": {
    "bootstrap": {
      "hoist": true
    }
  },
  "version": "0.0.1-alpha.0"
}


清理之前的安装包,可以使用如下命令:

lerna clean


目前业界有很多团队采用的 monorepo 解决方案是 Lerna 和 yarn 的 workspaces 特性,基于lerna和yarn workspace的monorepo工作流。一般都具有以下功能:

  • 完善的工作流
  • typescript支持
  • 风格统一的编码
  • 整的单元测试
  • 键式的发布机制
  • 美的更新日志

三、pnpm

常见的目录结构如下:

node_modules
├─ foo
|  ├─ index.js
|  └─ package.json
└─ bar
   ├─ index.js
   └─ package.json


3.1 安装pnpm

使用pnpm代替npm / Yarn,顺便用pnpx代替npx,命令如下:

pnpm install
pnpx create-react-app my-cool-new-app


3.2 pnpm 更新包

monorepo 项目中可以通过 --filter 来指定 package,进而更新包


3.3 pnpm 移除依赖

monorepo 项目中将包从node_modules 和 package.json 中移除,如下:


pnpm uninstall xxxxx --filter package-a


3.4 pnpm 硬连接项目

pnpm link ../xxxxxxx


我们可以使用pnpm、vite构建工具来实践一下,可以拿vue3、react17弄个demo试试。


pnpm可能不是适用于所有项目或所有堆栈的正确工具,但是如果我们想尝试解决的monorepo相同的问题,我们可以考虑将其作为替代方法。


四、总结

   工具是用来辅助我们项目开发的,当我们在选择工具的时候,应该结合团队的使用场景进行抉择。并不是越新的工具越好,当然啦,多尝试多点工具用来做技术学习,提升自己还是挺好的。


欢迎关注微信公众号前端早茶,与广东靓仔携手共同进阶

前端早茶专注前端,一起结伴同行,紧跟业界发展步伐~

相关文章
|
7月前
|
存储 缓存 资源调度
包管理npm、yarn、pnpm区别
包管理npm、yarn、pnpm区别
81 0
|
5月前
|
弹性计算 资源调度 Kubernetes
Flink三种集群模式,Standalone模式,Flink On YARN,Flink On K8S,这三种模式有啥优缺点,生产环境如何选择呢?
Flink三种集群模式,Standalone模式,Flink On YARN,Flink On K8S,这三种模式有啥优缺点,生产环境如何选择呢?
272 3
|
11天前
|
存储 资源调度 JavaScript
pnpm、npm、yarn是什么?怎么选择?
pnpm、npm、yarn是什么?怎么选择?
17 2
|
11天前
|
缓存 资源调度 JavaScript
npm、pnpm和yarn【简单了解】
npm、pnpm和yarn【简单了解】
22 2
|
11天前
|
存储 缓存 资源调度
三巨头对决:深入了解pnpm、yarn与npm
三巨头对决:深入了解pnpm、yarn与npm
241 0
|
11天前
|
缓存 资源调度 前端开发
npm、yarn、pnpm 如何删除缓存文件?
在前端工程化的环境下,频繁的安装、更新、移除依赖,总会产生一些不活跃的 npm 依赖包,一直隐藏在某个角落里。
88 5
|
6月前
|
资源调度
npm yarn 和 pnpm 之间命令的区别
npm yarn 和 pnpm 之间命令的区别
|
8月前
|
存储 缓存 资源调度
[Node] Node.js 包管理工具详解npm yarn cnpm npx pnpm
[Node] Node.js 包管理工具详解npm yarn cnpm npx pnpm
|
10月前
|
存储 缓存 资源调度
npm、cnpm、yarn和pnpm,我们应该选择哪个包管理工具?
在前端开发中,包管理工具是必不可少的工具之一。目前,市面上有多种包管理工具可供选择,如 `npm`、`cnpm`、`yarn` 和 `pnpm` 等。这些工具都具有自己的优点和缺点,选择适合自己的工具可以提高开发效率和代码质量。 本文将对这些工具的特点、优缺点和使用方法进行详细介绍,从而选择最适合自己的包管理工具。
588 0
npm、cnpm、yarn和pnpm,我们应该选择哪个包管理工具?
|
8月前
|
分布式计算 资源调度 监控
Hadoop学习笔记(四)之YARN
Hadoop学习笔记(四)之YARN