pnpm的安装与使用

官网:安装 | pnpm中文文档 | pnpm中文网

一、pnpm优势:

1.节省磁盘空间

假设你有一个依赖包 example-package,包含 100 个文件。如果你使用 npm 安装在 100 个项目中,你的硬盘上会有 100 份 example-package,每份都占用同样的空间。

然而,如果是使用 pnpm,

(1)example-package 的所有文件会被存放在全局存储位置。

(2)当你在一个项目中安装 example-package 时,pnpm 会创建指向全局存储中该包的硬链接。

(3)如果 example-package 发布了一个新版本,且只有一个文件有改动,pnpm 只会在全局存储中添加那个改动的文件,而不是重新保存所有文件。

2.提升安装速度

安装步骤

(1)解析依赖:确定项目所需的依赖包。这个过程包括读取项目的 package.json 文件,解析其中列出的依赖包及其版本信息,并确定所有需要安装的包及其依赖关系。

(2)检查全局存储:检查全局存储位置中是否已有这些依赖包。如果如果没有,下载并存储到全局位置。如果有,跳过下载步骤。

(3)硬链接:将所有依赖包硬链接到项目的 node_modules 目录

二、下载和使用

1.下载和配置环境

bash 复制代码
npm install -g pnpm

以下列表列出了以往的 pnpm 版本和对应支持的 Node.js 版本。

Node.js pnpm 7 pnpm 8 pnpm 9
Node.js 12
Node.js 14 ✔️
Node.js 16 ✔️ ✔️
Node.js 18 ✔️ ✔️ ✔️
Node.js 20 ✔️ ✔️ ✔️
bash 复制代码
#检查是否安装成功
pnpm --version

如果显示没有pnpm这个命令,要配置一下系统的环境变量。由于是全局安装的pnpm,所以可以在npm的全局安装路径找到。提示:官网没给出解决方案,我的是出问题了,chatgpt问出来的。

bash 复制代码
$ npm config get prefix
D:\GlobalNodeModules

然后再系统环境变量中的path新增D:\GlobalNodeModules

设置好后,可能需要关机重启。

2.设置源

bash 复制代码
//查看源
pnpm config get registry 
//切换淘宝源
pnpm config set registry http://registry.npm.taobao.org 

3.设置 pnpm 存储路径

bash 复制代码
#查看存储路径,默认是C:\Users\10938\AppData\Local\pnpm\store\v3
pnpm store path

#修改(官网:pnpm config set store-dir /path/to/.pnpm-store)
pnpm config set store-dir  D:/pnpm/.pnpm-store

4.基本命令

bash 复制代码
#1.安装依赖
pnpm install

#2.安装特定包
pnpm add <package>
#全局安装特定包
pnpm add -g <package>

#3.移除依赖 
pnpm remove <package>
pnpm remove <package> --global

#4.更新依赖
pnpm up   //更新所有依赖项
pnpm update <package>
pnpm update <package> --global

#5.检查过时的依赖
pnpm outdated

#6.运行脚本
pnpm run <script>

#7.查看配置
pnpm config get <key>

#8.设置配置
pnpm config set <key> <value>

#9.查看包信息
pnpm info <package>

#10.链接全局包
pnpm link <package>

#11.取消链接全局包
pnpm unlink <package>
相关推荐
ღ_23338 分钟前
vue3二次封装element-plus表格,slot透传,动态slot。
前端·javascript·vue.js
Ashley的成长之路16 分钟前
NativeScript-Vue 开发指南:直接使用 Vue构建原生移动应用
前端·javascript·vue.js
朕的剑还未配妥17 分钟前
Vue 2 响应式系统常见问题与解决方案(包含_demo以下划线开头命名的变量导致响应式丢失问题)
前端·vue.js
JNU freshman1 小时前
Element Plus组件
前端·vue.js·vue3
长空任鸟飞_阿康2 小时前
在 Vue 3.5 中优雅地集成 wangEditor,并定制“AI 工具”下拉菜单(总结/润色/翻译)
前端·vue.js·人工智能
liangshanbo12152 小时前
React + TypeScript 企业级编码规范指南
ubuntu·react.js·typescript
JNU freshman3 小时前
vue 技巧与易错
前端·javascript·vue.js
北冥有鱼3 小时前
Vue3 中子组件修改父组件样式之—— global() 样式穿透使用指南
vue.js
我是日安3 小时前
从零到一打造 Vue3 响应式系统 Day 28 - shallowRef、shallowReactive
前端·javascript·vue.js