一文全面了解pnpm、yarn、cnpm、npx、npm的使用(强烈建议收藏)

2023-08-31 14:33:37 浏览数 (1)

先说结论

  • 推荐使用:pnpm
    • 开源社区的宠儿
    • 国内的 Vue / Vite 团队很多都切换到pnpm

傻傻的分清：npx、npm、cnpm、pnpm、yarn

npm
简介

NPM是随同NodeJS一起安装的包管理工具，能解决NodeJS代码部署上的很多问题，常见的使用场景有以下几种：

  • 允许用户从NPM服务器下载别人编写的第三方包到本地使用。
  • 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
  • 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。
官网
  • 官网
    • https://www.npmjs.com/
菜鸟教程
  • 教程
    • https://www.runoob.com/nodejs/nodejs-npm.html
常用命令
  • npm CLI
    • https://docs.npmjs.com/cli/v9
  • 列表 查看 npm 版本
npx
简介

npm从5.25.2版开始，增加了 npx 命令

npm干嘛的？

  • 默认情况下，首先检查路径中是否存在要执行的包（即在项目中）；
  • 如果存在，它将执行；
  • 若不存在，意味着尚未安装该软件包，npx将安装其最新版本，然后执行它；

如果你使用的npm小鱼5.25.2，需要手动安装

代码语言：javascript复制
npm install -g npx
精华文章
  • npx 有什么作用跟意义？为什么要有 npx？什么场景使用？
    • https://blog.csdn.net/zz00008888/article/details/126117685
cnpm
官网
  • 官网
    • https://npmmirror.com/
简介

使用npm安装包时，需要去npm仓库获取，而npm仓库在国外，很不稳定，有时获取会失败。

  • npm默认仓库地址：http://registry.npmjs.org

为了解决这个问题，淘宝搭建了一个国内npm服务器，会定时拉取国外npm仓库内容，就是把国外的搬运到国内

这是一个完整 npmjs.org 镜像，你可以用此代替官方版本(只读)，同步频率目前为 10分钟 一次以保证尽量与官方服务同步。

使用方法

第一种方法：安装cnpm，之后下载仓库内容时使用cnpm命令即可

代码语言：javascript复制
npm install -g cnpm --registry=https://registry.npmmirror.com

第二种方法：替换npm默认仓库地址，执行下面命令，后续下载仓库内容时，继续使用npm命令

代码语言：javascript复制
npm config set registry https://registry.npmmirror.com

安装模块

代码语言：javascript复制
 cnpm install [name]
常用命令
  • 参照npm，把npm改为cnpm即可
yarn
简介
  • 快速：Yarn缓存了它下载的每个包，所以它再也不需要下载同一个包了。它还几乎同时执行所有操作，以最大限度地提高资源利用率。这意味着安装速度更快。
  • 可靠：使用详细但简洁的锁定文件格式和确定性的安装操作算法，Yarn能够保证在一个系统上运行的任何安装在另一个系统上将完全相同。
  • 安全：在执行代码之前，Yarn使用校验和来验证每个安装包的完整性。
官网
  • 官网
    • https://www.npmjs.com/package/yarn
安装
代码语言：javascript复制
npm install --global yarn

检查安装版本

代码语言：javascript复制
yarn --version
区别
  • yarn 是用 yarn add 代替 npm install
  • yarn remove 代替 npm uninstall
使用方法

官网Docs

  • https://classic.yarnpkg.com/en/docs/usage

安装依赖模块

代码语言：javascript复制
yarn add [package]
yarn add [package]@[version]
yarn add [package]@[tag]

删除依赖模块

代码语言：javascript复制
yarn remove [package]

更新依赖模块

代码语言：javascript复制
yarn upgrade [package]
yarn upgrade [package]@[version]
yarn upgrade [package]@[tag]

配置源

代码语言：javascript复制
# 查看镜像源
yarn config get registry

# 绑定镜像源
yarn config set registry https://registry.npmmirror.com

# 删除镜像源（注意这里是 delete）
yarn config delete registry
  • yarn默认的源地址：https://registry.yarnpkg.com ，如果下载太慢，可以修改源

pnpm简介

使用 npm 时，依赖每次被不同的项目使用，都会重复安装一次。 而在使用 pnpm 时，依赖会被存储在内容可寻址的存储中，所以：

  1. 如果你用到了某依赖项的不同版本，只会将不同版本间有差异的文件添加到仓库。例如，如果某个包有100个文件，而它的新版本只改变了其中1个文件。那么 pnpm update 时只会向存储中心额外添加1个新文件，而不会因为仅仅一个文件的改变复制整新版本包的内容。
  2. 所有文件都会存储在硬盘上的某一位置。当软件包被被安装时，包里的文件会硬链接到这一位置，而不会占用额外的磁盘空间。这允许你跨项目地共享同一版本的依赖。

因此，您在磁盘上节省了大量空间，这与项目和依赖项的数量成正比，并且安装速度要快得多！

相对npm优势2点

  • 节省磁盘空间
  • 提高安装速度

**重点：**关于pnpm介绍大家可以参照官网的说明，在这里就不赘述

  • 官网
    • https://pnpm.io/zh/
  • Docs
    • https://pnpm.io/zh/motivation
  • Install
    • https://pnpm.io/zh/installation

pnpm安装

第一种安装方式

Windows：打开PowerShell窗口，执行下面命令，注意是PowerShell窗口

代码语言：javascript复制
iwr https://get.pnpm.io/install.ps1 -useb | iex

**备注：**安装时容易挂，因为需要去github上下载包，github国内访问很不稳定，推荐第二种安装方式

第二种安装方式

直接使用npm 安装

代码语言：javascript复制
npm install -g pnpm
  • 执行结果 C:Userscoder>npm install -g pnpm npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead. npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead. added 1 package, and audited 3 packages in 5s found 0 vulnerabilities

pnpm常用命令

官网
  • CLI命令
    • https://pnpm.io/zh/cli/add
整理:

列举几个常用命令，其他命令大家参考上面的官网链接

pnpm add

安装软件包及其依赖的任何软件包。默认情况下，任何新软件包都安装为生产依赖项。

命令

说明

pnpm add sax

保存到 dependencies

pnpm add -D sax

保存到 devDependencies

pnpm add -O sax

保存到 optionalDependencies

pnpm add -g sax

Install package globally

pnpm add sax@next

从 next 标签下安装

pnpm add sax@3.0.0

安装指定版本 3.0.0

pnpm install

pnpm install 用于安装项目所有依赖.

  • 别名: i

pnpm update

pnpm update 根据指定的范围更新软件包的最新版本。 在不带参数的情况下使用时，将更新所有依赖关系。

命令

说明

pnpm up

遵循 package.json 指定的范围更新所有的依赖项

pnpm up --latest

更新所有依赖项，此操作会忽略 package.json 指定的范围

pnpm up foo@2

将 foo 更新到 v2 上的最新版本

pnpm up "@babel/*"

更新 @babel 范围内的所有依赖项

pnpm remove

别名: rm, uninstall, un 从 node_modules 和项目的 package.json 中删除相关 packages。

pnpm list

此命令会以一个树形结构输出所有的已安装package的版本及其依赖。 如果位置参数是 name-pattern@version-range 标识符，会将输出限制为仅为这样命名的包。例如，pnpm list "babel-*" "eslint-*" semver@5。

pnpm config

管理配置文件

代码语言：javascript复制
pnpm config list

查看当前镜像源

代码语言：javascript复制
pnpm config get registry

设置全局镜像源

代码语言：javascript复制
pnpm config set registry https://registry.npmmirror.com

设置项目临时镜像源

代码语言：javascript复制
npm install --registry https://registry.npmmirror.com

常用镜像列表

分类

地址

npm官方

https://registry.npmjs.org/

yarn官方

https://registry.yarnpkg.com

淘宝

https://registry.npmmirror.com

精华文章

  • 新一代包管理工具 pnpm 使用心得
    • https://zhuanlan.zhihu.com/p/546400909
  • 关于现代包管理器的深度思考——为什么现在我更推荐 pnpm 而不是 npm/yarn?
    • https://zhuanlan.zhihu.com/p/377593512
  • pnpm workspace changesets 构建你的 monorepo 工程
    • https://zhuanlan.zhihu.com/p/562340640

END

yarn npm cnpm 服务器 镜像

0 人点赞