Node.js学习笔记

NodeJS

Node.js 是一个基于 Chrome V8 的 JavaScript 引擎。

官网：nodejs.org

中文网: nodejs.cn

发展历史

2008年，Google 公司发布 Chrome 浏览器（V8 编译器）。

2009年，Node.js 项目诞生。它标志着 JavaScript 可以用于服务器端编程，从此网站的前端和后端可以使用同一种语言开发。

2010年，npm 项目诞生。标志着 JavaScript 进入模块化开发的时代。

2012 年，webpack 项目开源。

下载安装

官网下载tar.gz 包

# 解压
tar -xvf node-v16.20.1-linux-x64.tar.xz
# 添加链接
ln -s /opt/node/node-v16.20.1/bin/node /usr/local/bin/node
ln -s /opt/node/node-v16.20.1/bin/npm /usr/local/bin/npm
# 测试
node -v

npm

npm 是Node.js 的包管理工具，安装Node 时会自动安装npm 工具，可以使用 npm -v 验证是否安装成功。

npm中文网 : www.npmjs.cn

当前 npm 的稳定版本为 8.3.0 【时间：2022-01】

配置

# 查看npm所有配置项
npm config ls

镜像源

# 查看镜像源仓库地址
npm get registry
# 设置镜像源仓库为 国内的npm镜像源
npm config set registry https://registry.npmmirror.com

淘宝NPM 镜像站:Registry Endpoint：https://registry.npmmirror.com。Web 站点：https://npmmirror.com，

http://npm.taobao.org 和 http://registry.npm.taobao.org 将在 2022.06.30 号正式下线和停止 DNS 解析。

官方镜像源地址 http://www.npmjs.org，网速慢。

npmrc 配置文件

全局配置文件：/etc/npmrc
用户配置文件：~/.npmrc
项目配置文件：$项目根目录/.npmrc
通过 npm config 修改的是用户配置文件~/.npmrc

文件内容：

cache=D:\NodeJs\node_cache    # 定义缓存目录
prefix=D:\NodeJs        # 配置bin目录
# 设置仓库
registry=https://nvwa.jiuqi.com.cn/nexus/repository/npm-gov-group/
# 根据scope设置仓库
@ynwm:registry=http://registry.npm.beecode.cn/
@nr:registry=http://nvwa.jiuqi.com.cn/nexus/repository/npm-nvware-group/

安装软件包

npm 有两种安装软件包的方式：

  • 本地安装
  • 全局安装 （-g）

package.json

使用npm 局部安装软件包之前必须在当前目录下有package.json 文件，可以使用 npm init 命令创建：

# 在当前目录下生成 package.json（参数需要逐个手动指定）
npm init
# 在当前目录下自动生成 package.json
npm init -y

生成后的 package.json 内容如下：

{
  "name": "my_practice",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "dependencies": {
    "view-design": "^4.7.0",
    "vue": "^2.6.14"
  },
  "devDependencies": {},
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

官方文档说明： https://docs.npmjs.com/cli/v8/configuring-npm/package-json

参数说明：

dependencies：生产环境所需要的依赖

devDependencies：开发环境所需要的依赖

npm install xxx --save    		# 通过--save 或 -S 的方式来保存到dependencies中
npm install xxx --save-dev      # 通过--save-dev 或 -D的方式来保存到devdependencies中

​ 执行 npm install 命令后，会读取当前目录下的 package.json 文件，最终下载的软件包存放在当前目录下的node_modules 文件夹下。

​ 在使用npm install的时候会自动生成一个package-lock.json的文件，package-lock.json文件则会记录每个模块的详细信息，如模块的具体版本号和各个模块所依赖的子模块的信息。

package.json
package-lock.json

​ npm install 是将package.json下面的所有依赖报全部进行安装，而 npm install --production 则只是安装dependencies下的依赖而不安装devDependencies下的。

npm install

# 安装软件包（全局）
npm install -g <package>
# 安装软件包（局部）
npm i <package>
# 安装软件包（局部,指定版本）
npm i <package>@<version>
# 卸载包
npm uninstall <package>
# 更新包
npm update <package>
# 查看已安装的包
npm list -g --depth 0 
# 列出指定软件包所有可用的版本
npm view <package> versions
#  清除npm缓存
npm cache clean -f

注：安装软件包时，使用 @ 符号指定版本下载，如 npm install vue@2.6.14 ;

版本号

npm 软件包的版本号遵循语义化版本 semver ，所有的版本都有 3 个数字，版本格式：

主版本号.次版本号.修订号，版本号递增规则如下：

  1. 主版本号：当你做了不兼容的 API 修改，
  2. 次版本号：当你做了向下兼容的功能性新增，
  3. 修订号：当你做了向下兼容的问题修正。

  • 无符号: 仅接受指定的特定版本。

  • latest: 使用可用的最新版本。

  • ~: 如果写入的是 〜0.13.0，则只更新补丁版本：即 0.13.1 可以，但 0.14.0 不可以。

  • ^: 如果写入的是 ^0.13.0，则要更新补丁版本和次版本：即 0.13.1、0.14.0、依此类推。

  • *: 如果写入的是 *，则表示接受所有的更新，包括主版本升级。

  • >: 接受高于指定版本的任何版本。

  • >=: 接受等于或高于指定版本的任何版本。

  • <=: 接受等于或低于指定版本的任何版本。

  • <: 接受低于指定版本的任何版本。

package-lock.json

官方文档说明：https://docs.npmjs.com/cli/v8/configuring-npm/package-lock-json

​ package-lock.json 被设计用于多种目的，其中最重要的一个目的是确保每次安装都能生成唯一的软件包依赖树，因为在一个项目的团队开发中，我们希望每个开发人员安装的软件包版本都是一致的。

npm run

​ npm run 是 Node.js 包管理工具 npm 提供的一个核心命令，用于执行项目 package.json 文件中定义的自定义脚本（scripts）。它的核心作用是简化开发流程中常用命令的执行，让开发者无需手动输入复杂的命令行指令。

核心功能

  1. 统一管理脚本
    将项目中常用的命令（如启动服务、运行测试、构建代码等）集中在 package.json 的 scripts 字段中，便于维护和团队协作。
  2. 跨平台兼容
    自动处理不同操作系统（Windows/macOS/Linux）的路径、换行符等问题，确保脚本可移植性。
  3. 依赖隔离
    脚本执行时会自动加载项目的本地依赖（通过 node_modules/.bin 路径），无需全局安装工具。

npm script

Node 开发离不开 npm，而脚本功能是 npm 最强大、最常用的功能之一。

npm 允许在package.json文件里面，使用scripts字段定义脚本命令。

{
  // ...
  "scripts": {
    "build": "node build.js"
  }
}

上面代码是package.json文件的一个片段，里面的scripts字段是一个对象。它的每一个属性，对应一段脚本。比如，build命令对应的脚本是node build.js。

命令行下使用npm run命令，就可以执行这段脚本。

$ npm run build
# 等同于执行
$ node build.js

原理

​ npm 脚本的原理非常简单。每当执行npm run，就会自动新建一个 Shell，在这个 Shell 里面执行指定的脚本命令。因此，只要是 Shell（一般是 Bash）可以运行的命令，就可以写在 npm 脚本里面。

​ 比较特别的是，npm run新建的这个 Shell，会将当前目录的node_modules/.bin子目录加入PATH变量，执行结束后，再将PATH变量恢复原样。

​ 这意味着，当前目录的node_modules/.bin子目录里面的所有脚本，都可以直接用脚本名调用，而不必加上路径。比如，当前项目的依赖里面有 Mocha，只要直接写mocha test就可以了。

"test": "mocha test"
//而不用写成下面这样
"test": "./node_modules/.bin/mocha test"

由于 npm 脚本的唯一要求就是可以在 Shell 执行，因此它不一定是 Node 脚本，任何可执行文件都可以写在里面。

npm 脚本的退出码，也遵守 Shell 脚本规则。如果退出码不是0，npm 就认为这个脚本执行失败。

npx

npm 从5.2版开始，增加了 npx 命令。它有很多用处，本文介绍该命令的主要使用场景。

Node 自带 npm 模块，所以可以直接使用 npx 命令。万一不能用，就要手动安装一下。

$ npm install -g npx

调用项目安装的模块

npx 想要解决的主要问题，就是调用项目内部安装的模块。比如，项目内部安装了测试工具 Mocha。

$ npm install -D mocha

一般来说，调用 Mocha ，只能在项目脚本和 package.json 的scripts字段里面， 如果想在命令行下调用，必须像下面这样。

# 项目的根目录下执行
$ node-modules/.bin/mocha --version

npx 就是想解决这个问题，让项目内部安装的模块用起来更方便，只要像下面这样调用就行了。

$ npx mocha --version

npx 的原理很简单，就是运行的时候，会到node_modules/.bin路径和环境变量$PATH里面，检查命令是否存在。

由于 npx 会检查环境变量$PATH，所以系统命令也可以调用。

# 等同于 ls
$ npx ls

注意，Bash 内置的命令不在$PATH里面，所以不能用。比如，cd是 Bash 命令，因此就不能用npx cd。

注意，只要 npx 后面的模块无法在本地发现，就会下载同名模块。比如，本地没有安装http-server模块，下面的命令会自动下载该模块，在当前目录启动一个 Web 服务。

$ npx http-server

如果想让 npx 强制使用本地模块，不下载远程模块，可以使用--no-install参数。如果本地不存在该模块，就会报错。

$ npx --no-install http-server

pnpm

pnpm - 速度快、节省磁盘空间的软件包管理器

https://www.pnpm.cn/

yarn

https://www.yarnpkg.cn

yarn 与 npm 区别

  1. yarn安装速度快，因为它是异步执行安装依赖；npm是同步执行，它需要先安装好前面的包再接着安装。
  2. yarn安装过程信息很干净，npm会罗列很多其它包的信息，看过去感觉不直观。
  3. yarn安装后是有个yarn.lock文件，这个文件是会锁定你安装的版本，别人安装时会直接读取yarn.lock文件，这样可以保证安装的依赖的版本是一样的，npm在5.x.x的版本也引入了这个机制，它的文件叫package-lock.json。

yarn 和 npm 命令比对：

描述 yarn npm
初始化package.json yarn init (可以在后面添加-y跳过询问的信息) npm init (可以在后面添加-y跳过询问的信息)
根据package.json安装依赖 yarn install（可以省略install） npm install(install可以缩写成i)
安装某个依赖(默认是在dependencies) yarn add packageName –save（简写-S，或者省略该参数） npm install packageName –save（简写-S，或者省略该参数）
安装某个依赖在devDependencies yarn add packageName –dev（可以简写成-D） npm install packageName –save-dev（可以简写成-D）
全局安装依赖 yarn global add packageName npm install packageName -g
移除依赖 yarn remove packageName npm uninstall packageName
移除全局依赖 yarn global remove packageName npm uninstall packageName -g
升级依赖 yarn upgrade packageName（如果是全局的依赖则在yarn后面加上global） npm update packageName（如果是全局的依赖则在后面加上-g）
清理不需要的依赖文件 yarn clean
查看依赖包信息 yarn info packageName npm info packageName
查看所有配置 yarn config list npm config list 或者 npm config ls -l
查看某个配置的信息 yarn config get configName npm config get configName
设置淘宝源 yarn config set registry https://registry.npm.taobao.org npm config set registry https://registry.npm.taobao.org
查看当前源 yarn config get registry npm config get registry
罗列全局依赖 yarn global list –depth=0 npm list -g –depth 0
查看全局依赖目录 yarn global bin 或者yarn global dir npm prefix -g
查看全局缓存的目录 yarn cache dir npm config get cache
列出缓存包 yarn cache ls
清除缓存 yarn cache clean

配置

yarn config set cache-folder "D:\yarn\cache"
yarn config set global-folder "D:\yarn\global"

nvm

nvm 是一种流行的运行 Node.js 的方式。 例如，它可以轻松地切换 Node.js 版本。

nvm -v  #查看nvm版本
nvm list-remote    #要列出所有可用的Node.js版本，请运行以下命令。
nvm install v14.15.4    #安装指定版本:如果你想安装Node.js v14.15.4版本，运行以下命令。
nvm list  # 显示已安装的版本
nvm use version  #切换指定版本
nvm uninstall node-version    #如果你想卸载特定的Node.js版本，运行以下命令。

下载安装

# 首先，使用以下命令安装curl命令行工具：
dnf install curl -y

# 接下来，使用以下命令下载并运行NVM安装脚本：
curl https://raw.githubusercontent.com/creationix/nvm/master/install.sh | bash

# 接下来，使用以下命令为NVM激活环境变量：
source ~/.bash_profile

# 接下来，使用以下命令验证NVM的安装版本：
nvm --version

构建打包

vite

vite官方中文文档

webpack

webpack 是JavaScript应用的模块打包工具，于2012 年3月开源。

注：webpack 依赖于 Node 环境，Webpack 5 运行于 Node.js v10.13.0+ 的版本 

npm install webpack@5.65.0

目录结构

webpack-demo
|- package.json
|- webpack.config.js
|- /dist
|- /src
  |- index.js
|- /node_modules

dist 文件夹是webpack 打包出来的文件

src 源码

配置文件

​ 在 webpack 4 中，可以无须任何配置使用，然而大多数项目会需要复杂的设置，这就是为什么 webpack 仍然要支持配置文件。这比在终端(terminal)中手动输入大量命令要高效的多。

webpack 的配置文件是 js文件，

webpack.config.js

模块热替换

esbuild

esbuild 一个极快的打包器

esbuild官方描述的作用就是：一个JavaScript的打包和和压缩工具。

esbuild使用golang开发，在打包的速度上非常快，我们熟悉的 vite工具在dev模式下就是使用esbuild进行打包。

README

作者：银法王

版权声明：本文遵循知识共享许可协议3.0（CC 协议）： 署名-非商业性使用-相同方式共享 (by-nc-sa)

参考：

​ nodeJS 官网

​ webpack 官网

​ package.json 配置完全解读【字节跳动技术团队】

​ npx使用教程【阮一峰】

修改记录：

　　2022-01-01 第一次修订

​ 2024-07-01 添加vite、npmx 等相关内容

前端 > Node.js
#Node.js #前端
Node.js学习笔记
http://jackpot-lang.online/2021/05/08/前端之路/Node 笔记/
作者
Jackpot
发布于
2021年5月8日
许可协议