前端环境最方便的管理方式

做前端的人都知道，经常会维护好几个项目，老的项目可以使用 vue2 的版本，node 的版本最高也就是 v14.21.3，使用 vue3 的时候就需要至少 16，有一些库使用还要求 node 的版本为 18 及以上，怎么办？ 前端的依赖下载很慢，经常断线会失败如何快速下载 npm 包呢？ 下面介绍 node 版本管理工具 nvm npm 下载源管理工具 nrm

nvm

安装前把电脑上的 node 安装包和软件清理干净

Windows 安装包下载地址：https://github.com/coreybutler/nvm-windows/releases

Mac/Linux 使用命令安装,说明文档：https://github.com/nvm-sh/nvm?tab=readme-ov-file#install—update-script

安装和更新脚本 到 安装 或者 更新 nvm,你应该运行 安装脚本。为此,您可以手动下载并运行脚本,或使用以下 cURL 或 Wget 命令:

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.3/install.sh | bash

wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.3/install.sh | bash

运行上述任一命令都会下载脚本并运行它。该脚本克隆 nvm 存储库以 /.nvm, 并尝试将下面代码片段中的源行添加到正确的配置文件(/.bashrc, ~/.bash_profile, ~/.zshrc, 或 ~/.profile)。如果您发现安装脚本正在更新错误的配置文件,请设置 $PROFILE env var 到配置文件路径,然后重新运行安装脚本。

export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm

常用命令

nvm list // 显示已安装的版本（同 nvm list installed）
nvm list installed // 显示已安装的版本
nvm list available // 显示所有可以下载的版本
nvm install 14 // 安装14中最新的
nvm install latest // 安装最新版本node
nvm use 14 // 使用14版本node

➜  astro-content git:(master) ✗ nvm i 14
Downloading and installing node v14.21.3...
Local cache found: ${NVM_DIR}/.cache/bin/node-v14.21.3-darwin-x64/node-v14.21.3-darwin-x64.tar.xz
Checksums match! Using existing downloaded archive ${NVM_DIR}/.cache/bin/node-v14.21.3-darwin-x64/node-v14.21.3-darwin-x64.tar.xz
Now using node v14.21.3 (npm v6.14.18)

➜  astro-content git:(master) ✗ nvm list
->     v14.21.3
       v22.15.0
default -> 22 (-> v22.15.0)
iojs -> N/A (default)
unstable -> N/A (default)
node -> stable (-> v22.15.0) (default)
stable -> 22.15 (-> v22.15.0) (default)
lts/* -> lts/jod (-> N/A)
lts/argon -> v4.9.1 (-> N/A)
lts/boron -> v6.17.1 (-> N/A)
lts/carbon -> v8.17.0 (-> N/A)
lts/dubnium -> v10.24.1 (-> N/A)
lts/erbium -> v12.22.12 (-> N/A)
lts/fermium -> v14.21.3
lts/gallium -> v16.20.2 (-> N/A)
lts/hydrogen -> v18.20.8 (-> N/A)
lts/iron -> v20.19.4 (-> N/A)
lts/jod -> v22.18.0 (-> N/A)

nrm

• 命令命令 使用文档：https://www.npmjs.com/package/nrm

# npm
npm install -g nrm

# yarn
yarn global add nrm

# pnpm
pnpm add -g nrm

• 查看可用源

nrm ls

* npm ---------- https://registry.npmjs.org/
  yarn --------- https://registry.yarnpkg.com/
  tencent ------ https://mirrors.tencent.com/npm/
  cnpm --------- https://r.cnpmjs.org/
  taobao ------- https://registry.npmmirror.com/
  npmMirror ---- https://skimdb.npmjs.com/registry/
  huawei ------- https://repo.huaweicloud.com/repository/npm/

• 使用 nrm 的源

$ nrm use taobao

SUCCESS The registry has been changed to 'taobao'.

Pnpm 安装使用

官方文档：https://pnpm.io/ 使用文档：https://www.npmjs.com/package/pnpm npm 只要有一个项目就需要安装依赖，项目多的时候电脑的磁盘占用太大了，建议都使用 pnpm 来安装依赖，他只会在一个地方下载依赖，其它项目使用都是引用的方式，大大的节约磁盘空间

• 安装

npm i -g pnpm

兼容性

以下是各版本 pnpm 与各版本 Node.js 之间的兼容性表格。

命令

有关更多信息，请参阅各个 CLI 命令的文档。 以下是简便的 npm 命令等效列表，可帮助你入门：

Node、Python、Linux 常用下载源管理:点这里