前端开发环境配置完全指南

0 阅读3分钟

前端开发环境配置完全指南:NVM、Node.js、NPM 与 Pip 镜像源设置

一站式搞定 Node.js 版本管理、NPM 配置与环境变量设置


目录

  1. Node.js 与 NPM 的关系
  2. NVM(Node Version Manager)安装与配置
  3. NPM 镜像源设置
  4. Node.js 环境变量配置
  5. NVM 常用指令大全
  6. Python Pip 镜像源配置

1. Node.js 与 NPM 的关系

工具作用
Node.js提供运行 JavaScript 的运行时环境与平台
NPM (Node Package Manager)管理 Node.js 平台上使用的代码库(包)的工具

📌 官方集成:官方人员意识到这一点,将 NPM 安装集成到了 Node.js 中。也就是说,现在你只需要安装 Node.js,就同时安装了 NPM

参考资料:


2. NVM(Node Version Manager)安装与配置

2.1 为什么需要 NVM?

在实际开发中,不同项目可能需要不同的 Node.js 版本。NVM 可以帮助你:

  • ✅ 在同一台机器上安装多个 Node.js 版本
  • ✅ 随时切换当前使用的 Node.js 版本
  • ✅ 方便测试项目在不同 Node 版本下的兼容性

2.2 下载 NVM

推荐下载地址:

2.3 配置淘宝镜像(加速下载)

在 NVM 安装目录下找到 setting.txt 文件,添加以下内容:

ini

nvm node_mirror https://npmmirror.com/mirrors/node/
nvm npm_mirror  https://npmmirror.com/mirrors/npm/

💡 这样在通过 nvm install 下载 Node.js 时,会使用国内镜像源,速度更快。


3. NPM 镜像源设置

3.1 全局设置 registry

bash

# 设置为淘宝镜像源(推荐)
npm config set registry http://registry.npmmirror.com/

# 查看当前 registry
npm config get registry

3.2 .npmrc 文件说明

安装 NPM 后,默认会在 C:\Users\你的用户名 目录下生成一个 .npmrc 文件,该文件就是 NPM 的配置文件,其中包含了 registry 等镜像源信息。

3.3 安装时临时指定镜像源

bash

npm install --registry=https://registry.npmmirror.com/ 包名

4. Node.js 环境变量配置

4.1 NVM 相关系统变量

变量名示例值说明
NVM_HOMED:\nvmNVM 安装目录
NVM_SYMLINKD:\Program Files\nodejs当前激活的 Node.js 软链接目录

4.2 配置 NPM 全局包路径

在安装 Node.js 的路径下,手动创建以下两个文件夹:

  • node_global — 存放全局安装的包
  • node_cache — 存放缓存文件

然后以管理员身份运行 CMD,执行:

bash

npm config set prefix "D:\Program Files\nodejs\node_global"
npm config set cache "D:\Program Files\nodejs\node_cache"

4.3 验证配置

bash

npm config list
# 或
npm config get registry

4.4 配置系统环境变量

与 Java JDK 配置类似,新建系统变量:

变量名
NODE_PATH你安装 Node.js 的存储路径(如 D:\Program Files\nodejs

4.5 测试全局安装

bash

npm install express -g

如果安装成功,说明环境变量配置正确 ✅

4.6 管理员模式启用 NVM

bash

# 以管理员身份运行 CMD,开启 NVM 管理功能
nvm on

# 下载指定版本的 Node.js
nvm install 18.17.0

# 使用指定版本
nvm use 18.17.0

5. NVM 常用指令大全

命令说明
nvm version查看 NVM 版本
nvm install 18.17.0安装指定版本的 Node.js(附带 NPM)
nvm uninstall 18.17.0卸载指定版本
nvm list查看已安装的版本列表(同 nvm list installed
nvm list installed显示已安装的版本
nvm list available显示所有可以下载的版本
nvm use 18.17.0切换到指定版本
nvm root查看 NVM 安装路径
nvm install latest下载最新的 Node.js 版本及对应的 NPM
nvm on开启 Node.js 版本管理功能(管理员模式)
nvm off关闭 Node.js 版本管理功能

6. Python Pip 镜像源配置

6.1 配置全局镜像源

bash

# 中科大镜像源
pip config set global.index-url https://pypi.mirrors.ustc.edu.cn/simple/

# 或使用阿里云镜像源
pip config set global.index-url https://mirrors.aliyun.com/pypi/simple/

6.2 查看当前配置

bash

pip config list

总结

工具核心用途关键命令
NVM管理多个 Node.js 版本nvm install, nvm use
NPM管理 Node.js 包npm config set registry
Pip管理 Python 包pip config set global.index-url

掌握以上配置,你就可以在不同项目间自由切换 Node.js 版本,并享受国内镜像源带来的极速下载体验 🚀