pnpm 多包管理项目

简介: pnpm 多包管理项目

Monorepo是一种项目管理方式,就是把多个项目放在一个仓库里面,可以参考神三元大佬的一篇文章:现代前端工程为什么越来越离不开 Monorepo?,这篇文章中介绍了Monorepo的概念、收益以及MulitRepo的弊端

pnpm就是一个包管理工具,原生支持Monorepo,比npm和yarn更快一些,其他的可以参考官网和神三元大佬的另一篇文章:为什么现在我更推荐 pnpm 而不是 npm/yarn?

pnpm的依赖并不是全部打平下载到node_modules下的,我们都知道,如果是npm或者yarn下载的依赖包的话,他会打平整个依赖结构 那什么是打平结构呢 ,其实就是将所有的依赖都放在同一级去展示,因为我们的所以来的库可能又依赖了别的库,以此类推可能层层嵌套,这个时候yarn和npm 会将他们打平,也就是将这些嵌套的依赖统统整理到node_modules下. 但是这样会造成一个问题,那就是一些没有在package.json里声明的包我们也可以引入进来.这样会造成极大的隐患.

而pnpm则采用了这种方式
image.png
将所有在描述文件中声明的包下载到node_modules下,同时将他们所依赖的依赖包下载到.pnpm文件夹下

Monorepo的管理方式就自然会出现依赖重复,或者自己写的某个包依赖于另一个包这种情况。而pnpm的workspace以及他的依赖管理策略就很好的解决了这一问题,

接下来就让我们从零开始使用pnpm去搭建一个Monorepo系统吧

首先安装pnpm

npm install pnpm -g

然后新建一个文件夹,用ide打开之后初始化这个文件夹的package.json,也就是我们的项目描述文件

pnpm init

接着新建pnpm-workspace.yaml文件 ,里面写上需要建立workspace的文件夹

packages:
  # packages下所有的子包
  - 'packages/*'
  # components文件夹下所有的子包
  - 'components/**'
  # api文件夹下所有的子包
  - 'api/**'

接着我们去创建一个packages文件夹.同时也创建一个api文件夹和conponents文件夹.
api和components文件夹就代表我们的内部使用的包.需要被多个子应用给引用到.而packages则放置我们的子应用. 最终的一个目录结构应该是这样的
image.png
当我们需要安装依赖的时候,使用pnpm install 命令就会自动检索所有的工作空间的package.json文件里记录的依赖.

如果需要给某一个子包下载依赖的话,可以使用

pnpm -F 子包名 add 需要下载的包名

pnpm 可以通过-F 来选择不同的子包.

需要注意的是你的子包名字最好自己重新命名一个,修改package.json的name字段,因为如果再npm库里有和你同名的包的话,pnpm好像是会去网上下载的,而不会直接使用你本地的子包.

当下载了本地的子包后可以指定@*这样,就会实时使用最新的包.
image.png

相关文章
|
12月前
|
存储 缓存 资源调度
包管理npm、yarn、pnpm区别
包管理npm、yarn、pnpm区别
108 0
|
5月前
npm 包管理
npm 包管理
28 0
|
5月前
|
JSON JavaScript 数据格式
使用pnpm搭建monorepo开发环境
使用pnpm搭建monorepo开发环境
217 0
|
5月前
|
JavaScript 前端开发 API
npm 包管理工具
npm 包管理工具
86 0
|
11月前
pnpm的安装与使用
pnpm的安装与使用
294 0
|
存储 缓存 资源调度
npm、cnpm、yarn和pnpm,我们应该选择哪个包管理工具?
在前端开发中,包管理工具是必不可少的工具之一。目前,市面上有多种包管理工具可供选择,如 `npm`、`cnpm`、`yarn` 和 `pnpm` 等。这些工具都具有自己的优点和缺点,选择适合自己的工具可以提高开发效率和代码质量。 本文将对这些工具的特点、优缺点和使用方法进行详细介绍,从而选择最适合自己的包管理工具。
1237 0
npm、cnpm、yarn和pnpm,我们应该选择哪个包管理工具?
|
存储 缓存 资源调度
Vite 是如何发布 npm 包的?
Vite 是如何发布 npm 包的?
374 1
|
存储 资源调度 安全
pnpm:基础使用
pnpm:基础使用
426 0
|
缓存 分布式计算 前端开发
从npm版本依赖到Monorepo大仓项目
前端的发展很快,自从node.js的出现,打开前端新的大门,npm让js有了自己的包管理能力,能够让前端项目工程化,从而能够处理更加复杂的前端项目。
247 0
|
存储 JSON 资源调度
NPM 包管理器简介
NPM 包管理器简介