配置指南-掌握Node.js配置

本文最后更新于：5 个月前

导言

  • 本文通过简要介绍npm、nvm和node的关系以及它们对于开发者的重要作用，帮助读者理解和配置这些工具
  • 在我的日常开发过程中，使用到很多前端开发工具、构建工具（如vite-cli）、打包工具（如webpack），这些工具通常需要通过npm进行安装
  • 我还使用到许多的后端前沿框架、容器（如Docker）和各类数据库驱动服务（如MongoDB），这些框架通常使用npm进行安装和管理
  • 总的来说，Node.js环境在前端开发、后端开发、构建工具、自动化测试、静态代码分析等方面都有广泛的应用。它为开发者提供了大量的工具和框架，使得开发更加高效和便利
  • 总的来说，Node.js环境是非常重要的，我们当然不会将以上涉及到的庞大的知识体系逐一讲解，我们将要学习的，是Node.js的基础配置，为我们以后的开发打下坚实的基础

正文

概念

什么是Node.js：

1
Node.js是一个基于Chrome V8引擎的JavaScript运行环境。它允许开发者使用JavaScript来构建服务器端的高性能应用程序。它提供了一种非阻塞、事件驱动的编程模型，使得处理并发、I/O密集型的任务变得更加高效和可扩展。通过Node.js，开发者可以使用熟悉的JavaScript语言来构建快速、可靠的服务器端应用程序

什么是npm：

1
npm是Node Package Manager的缩写，是一个用于Node.js项目的包管理工具。它是世界上最大的包管理器，拥有数量庞大的开放源码软件包和模块供开发者使用。通过npm，开发者可以方便地安装、更新和管理项目所需的依赖包，以及运行和测试脚本。

什么是nvm：

1
nvm是Node Version Manager的缩写，它是一个工具，允许你在同一台机器上安装和管理多个Node.js版本。nvm使得开发者可以轻松切换不同的Node.js版本，而无需手动安装和配置每个版本。这对于开发者来说非常有用，因为不同的项目可能需要不同的Node.js版本，nvm可以帮助开发者更好地管理这些版本。

nvm、npm和Node.js的关系：

1
nvm是Node Version Manager的缩写，它是一个工具，允许你在同一台机器上安装和管理多个Node.js版本。这对于开发者来说非常重要，因为不同的项目可能需要不同的Node.js版本，nvm允许你在这些项目之间轻松切换，而无需手动安装和配置每个版本
1
Node.js则是这两个工具的基础，它提供了一个JavaScript运行环境，使得开发者可以在服务器端构建高性能的应用程序。npm和nvm作为与Node.js紧密相关的工具，为开发者提供了更好的开发和管理环境。
  • 这上面说的真他妈官方，总结起来就一句话：
  • Node.js是一种开发环境，npm是一种包管理工具，管理Node.js项目所需依赖包；nvm是一种版本管理工具，可以管理多个不同的Node.js版本，这就是三者的联系

Node.js的配置

  • 有关Node.js的安装配置有两种，我们可以单独下载并配置，这样做的好处是快捷方便，但是将来要更换其版本就会较为繁琐
  • 另一种方法是使用nvm统一管理，更加轻松方便切换不同的Node.js版本，推荐使用这种方法
  • 接下来相关下载安装配置均在windows系统上执行，因为本人在Linux系统上使用Node.js环境较少，有机会可以学习下

单独配置

image-20230624212110319
  • 配置环境变量
  • 注意，这里要配置两个环境变量：node的根目录、根目录下的node_global路径
image-20230624212320737
image-20230624212541131
  • 配置的时候细心点就行了，大功告成

使用nvm统一管理（推荐）

image-20230624213113061
  • 配置环境变量
image-20230624213419870
image-20230624213519238
  • 下载安装、配置环境变量还是非常简单的

目录介绍

常用命令

1
node -v    					   #查看node版本 
1
npm -v     				       #查看npm版本 
1
nvm -v	                       #查看nvm版本 
1
nvm list					   #查看已安装的node版本号
1
nvm list available			   #查看可安装的node版本
1
nvm install 【版本号】			#安装指定版本的node
1
nvm use 【版本号】				#使用指定版本的node
1
nvm uninstall 【版本号】			#卸载指定版本的node
1
npm config get registry			   #查看当前下载源
1
npm config set registry http://registry,npm.taobao.org            #设置下载源为淘宝源
1
npm config get prefix          #获取npm全局安装地址
1
npm config get cache           #获取npm全局缓存位置
1
npm config set prefix "D:\softWare\nvm\nvm\v16.19.0\node_global"   #修改npm全局安装位置
1
npm config set cache "D:\softWare\nvm\nvm\v16.19.0\node_cache"     #修改npm全局缓存位置
1
yarn config get registry			   #查看当前下载源
1
yarn config set registry https://registry.yarnpkg.com	#淘宝源
1
yarn config set registry https://registry.npmmirror.com		#源
  • 查看node、npm、nvm版本

image-20230624180830876

  • 这也是检验node、npm、nvm是否配置成功的方法
  • 查看已安装的node版本号

image-20230624204645046

  • 查看可安装的node版本，并安装最新版

image-20230704145801954

  • 使用指定版本的node

image-20230704150100145

实践

踩坑经历

settings.txt文件错误

  • 我在重新配置环境变量以后，再次执行 nvm -v 命令，发现了这个错误：
1
ERROR open \settings.txt: The system cannot find the file specified

image-20230624205604711

  • 其实还是上面提到的：重新配置nvm及node环境变量以后，记着同步这个settings.txt文件

修改node版本无效

  • 当你的nvm管理多个不同版本的node时，如果版本切换之后无效，则可能的原因是由于之前配置环境变量时，把node的路径写死了。重新配置环境变量的路径后即可切换版本生效

node版本过高/过低

  • 没错，node版本过高/过低都会引发问题，不过这里并不是特指一个问题，而是各种程序运行时，所需node环境不同
  • 我这里举两个我遇到的案例：
1
2
在本地启动VuePress文档站点服务时，由于node版本过高，启动失败
我将node版本从18.16.1修改至16.19.0后，成功解决问题
1
2
在安装配置VitePress文档站点的hope主题时，由于node版本过低，安装失败
我将node版本从16.19.0修改至18.16.1后，成功解决问题
  • 这里也能比较出VuePress站点生成器相较于VitePress，是有点落后了
  • 有关详细案例还请移步至文章：《大道至简：快速搭建博客与文档站点的终极指南1.0》
  • 这里其实涉及到一个兼容性问题，不同的程序需要的或者说兼容的node环境是不一样的，
  • 以我的经验来看，看情况按需修改node版本以适应不同需求即可，没有特别好的办法
  • 当node版本过高时，可能会遇到难以预料的错误（这一点我深有体会）。即使你下载的是LTS（长期支持版），但高版本的node总会出现莫名的问题，此时必须切换至低版本的node，即可能出现如下报错：
1
node:internal/crypto/hash:71 this[kHandle] = new _Hash(algorithm, xofLen)；

淘宝镜像出问题

  • 最近使用npm install时，出现以下报错：（2023/08/01早）
1
[##################] \ reify:typescript: timing reifyNode:node_modules/@babel/parser Completed in 291ms
  • 这是因为npm默认的镜像设置为了淘宝镜像，这镜像老出毛病，修改npm镜像为官方镜像即可：
1
npm set registry https://registry.npmjs.org/

yarn安装失败

  • 最近在开发 PicMemories 壁纸分享小程序，想着给开发一个后台管理员页面，正好借用下API接口开放平台的 Ant Design Pro框架
  • 结果在使用 umi/router 进行页面跳转时，安装依赖老是失败
  • 我跟着官网操作，一直报错，执行以下命令也不显示 umi 版本：（2023/08/08晚）
1
umi -v

  • 官网：在页面间跳转 | UmiJS

  • 然后我就看到报错信息，问了一下AI，那大聪明教我添加环境变量，让yarn生效即可（？！）

  • 我还真照做了：

image-20230808193118974

  • 结果当然是后来的各种命令都是在执行过程中，各种报错，如：
1
yarn install
1
yarn start:dev			#启动项目
  • 把那个环境变量删除了，又出现了这么个错误：
1
info There appears to be trouble with your network connection. Retrying...
  • 这个是真恶心，我改了镜像源还是无效：
1
yarn config get registry			   #查看当前下载源
1
yarn config set registry https://registry.yarnpkg.com	#淘宝源
1
yarn config set registry https://registry.npmmirror.com		#源
1
yarn install
  • 然后我又在新拉取下来 API项目下执行了该命令，结果报错了：

image-20230808194524015

  • 看报错信息，把config/config.ts下的 requestRecord删除就行了，也不知道抽什么风了
1
2
3
4
5
6
7
8
9
10
11
openAPI: [
   {
     requestLibPath: "import { request } from '@umijs/max'",
     schemaPath: 'http://localhost:8101/api//v2/api-docs',
     projectName: 'memory-api',
   },
 ],
 mfsu: {
   strategy: 'normal',
 },
 requestRecord: {},
  • 问题完美解决，项目成功启动了

其他问题

  • 还要注意的是，修改环境变量配置后，有时候在短时间内是不会生效的，这个坑我踩过好多遍了，我的经验是要等待3 - 5分钟才会生效的
  • 还有就是你平时见到的像如下所示的报错，九成的概率是环境变量配置错误了，赶紧检查一下环境变量吧
1
nvm/npm/node/hexo不是内部或外部命令

VuePress 搭建 Blog 启动失败

  • 最初还以为是 node.js 版本问题，结果是 modules 目录构建有问题（2023/11/25晚）

image-20231126003630708

  • 解决了，方案如下：
  • 删除目录下的 modules 目录，执行以下命令重新构建 modules 目录：
1
yarn install
  • 再次尝试启动 blog，启动成功：

image-20231126004435021

经验总结

pnpm全局安装无效

  • 在配置vuepress文档站点的主题时，需要用到pnpm包管理器来安装执行命令，于是想了解npm、pnpm、yarn的区别和安装方法
  • 关于这块的详细内容，可以在《理解npm、pnpm和yarn：选出最适合你的包管理器》一文中了解
  • 这里我介绍下我遇到的pnpm全局安装后，pnpm命令仍不生效的问题
  • 我在使用如下命令进行全局安装pnpm包管理器后，仍然报错：‘pnpm‘ 不是内部或外部命令，也不是可运行的程序或批处理文件
1
npm i -g pnpm
  • 这其实是因为在我们配置了nvm后，没有修改npm全局安装地址，导致pnpm没有安装在nvm管理下的Node.js目录下
  • 这样就导致了我们在nvm管理下，配置的Node.js环境变量未对pnpm生效
  • 这里涉及到Node.js环境变量的配置相关知识，详情可在上文 Node.js的配置一栏中了解

image-20230703094859712

  • 如上图所示，npm默认状态下，pnpm全局安装在了 D:\softWare\node\node_global下，导致在nvm管理下，配置的Node.js环境变量未对pnpm生效
  • 解决方法很简单，修改npm默认全局安装地址，将pnpm安装在已配置好的Node.js环境变量目录下即可
  • 执行以下命令，修改npm默认全局安装地址为在nvm管理下的Node.js目录下的node_global下
1
npm config set prefix "D:\softWare\nvm\nvm\v16.19.0\node_global"
  • 在此执行全局安装pnpm，可以看到pnpm已成功安装在nvm管理下的Node.js目录下的node_global下了

  • 执行以下命令，查看pnpm版本，结果如图所示：
1
pnpm -v

image-20230703100054233

修改node版本

  • 使用nvm管理不同版本的node后，修改npm版本时要注意以下几点：
    1. 修改可能会失效，这是因为环境变量写死了上个一个node版本了，修改NODE_PATH路径即可
    2. npm全局安装路径也要注意同步修改，改成新版本下的node_global目录下
    3. 检查原node环境下的构建工具、包管理工具是否成功安装
  • 第二个错误我就犯过，没有及时修改全局安装路径，导致安装pnpm后，pnpm又失效了
  • 第三个要特别注意，新的node环境下可能没有原node环境下的构建/包管理工具，当你在新node环境下使用这些工具时，会报如下错误：
1
***既不是外部命令，也不是可执行的内部命令
  • 很常见的问题，确认Node.js环境变量配置无误后，执行npm全局安装该工具即可：
1
npm i -g ***
  • 这就是修改node版本时，需要注意的要点及如何解决可能出现的相关问题

Linux 一键安装 Node.js 环境

  • 在 Linux 系统中，可以使用以下命令安装最新版本的 Node.js：（2023/11/26午）
1
2
curl -sL https://deb.nodesource.com/setup_current_lts.x | sudo -E bash -
sudo apt-get install -y nodejs
  • 在 macOS 系统中，可以使用 Homebrew 安装最新版本的 Node.js：
1
2
bash复制代码
brew install node@latest

总结

  • Node.js的配置还是比较容易的，有机会的话，后续会持续更新进阶的Node.js的配置教学
  • 非常感谢您能够阅读到这里，感谢您对本人的支持！
包管理器 > node > 经验
#经验 #包管理器 #node
配置指南-掌握Node.js配置
https://deng-2022.gitee.io/blog/2023/06/24/配置指南-掌握Node-js配置/
作者
Memory
发布于
2023年6月24日
更新于
2023年12月6日
许可协议