NPM进阶知识与用法详解（一）

一、引言

1. NPM简介

2. NPM在前端开发中的重要性

3. 文章目的与结构

二、NPM基础回顾

1. NPM的安装与配置

安装：

NPM通常是与Node.js一起安装的。当你从Node.js官网下载并安装Node.js时，NPM也会同时被安装到你的系统中。安装完成后，你可以通过命令行工具来访问和使用NPM。

配置：

NPM的配置可以通过命令行参数、环境变量和.npmrc文件来完成。其中，.npmrc文件是一个用于存储NPM配置选项的文本文件，可以位于用户主目录下（作为全局配置），也可以位于项目根目录下（作为项目配置）。

一些常见的NPM配置选项包括：

• registry：指定用于下载包的NPM注册表地址。
• proxy 和 https-proxy：设置HTTP/HTTPS代理服务器的地址和端口。
• save-prefix：指定在package.json文件中保存依赖项时使用的前缀（默认为^）。

• save-exact：设置为true时，将依赖项的确切版本保存在package.json文件中，而不是使用版本范围。

2. NPM的常用命令

• 初始化项目：npm init
  该命令用于初始化一个新的Node.js项目，并生成一个package.json文件。package.json文件是项目的元数据文件，用于存储项目的配置信息和依赖项列表。

执行npm init命令后，系统会提示你输入一些项目信息（如项目名称、版本、描述等），你可以根据提示进行输入，也可以直接使用默认值。完成输入后，NPM会生成一个包含这些信息的package.json文件。

• 安装包：npm install

• 该命令用于安装Node.js包（模块）。你可以通过指定包的名称和版本来安装特定的包。安装的包将被下载并保存到项目的node_modules目录中。

例如，要安装一个名为express的包，可以执行以下命令：

npm install express

你还可以使用--save或-S选项将安装的包添加到package.json文件的依赖项列表中，以便其他人可以通过npm install命令来安装相同的依赖项。

• 卸载包：npm uninstall

该命令用于卸载已经安装的Node.js包。你可以通过指定包的名称来卸载特定的包。卸载后，包将从node_modules目录中被删除，并且在package.json文件中的依赖项列表中也会被移除。

例如，要卸载名为express的包，可以执行以下命令：

npm uninstall express

• 更新包：npm update
  该命令用于更新已经安装的Node.js包到最新版本。你可以通过指定包的名称来更新特定的包，或者不带参数地执行该命令以更新所有已安装的包。

例如，要更新名为express的包到最新版本，可以执行以下命令：

npm update express

• 查看已安装包：npm list
  该命令用于列出已经安装的Node.js包。你可以通过指定包的名称来查看特定包的详细信息，或者不带参数地执行该命令以列出所有已安装的包。

例如，要查看已安装的所有包，可以执行以下命令：

npm list

3. package.json文件解析

package.json文件是一个JSON格式的元数据文件，用于存储Node.js项目的配置信息和依赖项列表。下面是一个典型的package.json文件示例：

{
  "name": "my-project",
  "version": "1.0.0",
  "description": "A sample Node.js project",
  "main": "index.js",
  "scripts": {
    "start": "node index.js"
  },
  "dependencies": {
    "express": "^4.17.1"
  },
  "devDependencies": {
    "mocha": "^7.0.0"
  },
  "license": "MIT"
}

• name：项目的名称。
• version：项目的版本号。
• description：项目的描述信息。
• main：项目的入口文件。
• scripts：一个包含脚本命令的对象，可以通过npm run <script-name>来执行相应的脚本命令。
• dependencies：一个包含项目运行时所需依赖项的列表。每个依赖项由一个名称和一个版本号组成。
• devDependencies：一个包含项目开发时所需依赖项的列表。这些依赖项通常只在开发过程中使用，不会在生产环境中使用。
• license：项目的许可证类型。

三、NPM进阶知识

1. NPM依赖管理

NPM（Node Package Manager）是Node.js的包管理器，它允许开发者从其注册中心安装、更新和管理Node.js库和工具。在NPM中，依赖管理是一个核心概念，它确保项目所需的包正确安装并与其他包协同工作。

1. 依赖类型：dependencies与devDependencies

在package.json文件中，有两种主要的依赖类型：

• dependencies：这些是项目运行时所必需的包。换句话说，如果你的代码在生产环境中运行，那么这些依赖是必需的。例如，Express.js（一个web框架）可能是一个依赖，因为你的应用在生产环境中需要它来处理HTTP请求。

• devDependencies：这些是仅在开发过程中需要的包，例如测试框架（如Jest）或构建工具（如Webpack）。这些包不会在生产环境中使用，因此不会被包含在生产环境的依赖安装中。

2. 依赖版本控制：

在package.json中，你可以为依赖指定版本范围，NPM支持几种不同的版本范围指定符：

• ^：允许安装指定版本或该主版本下的最新次要版本/补丁版本。例如，^1.2.3将允许安装1.2.3、1.2.4、1.3.0等，但不允许2.0.0。
• ~：允许安装指定版本或该次要版本下的最新补丁版本。例如，~1.2.3将允许安装1.2.3、1.2.4等，但不允许1.3.0。
• *：允许安装任何版本。这在某些情况下可能是危险的，因为它可能导致不兼容的更新。

3. 依赖冲突解决策略

当项目中的不同包依赖于同一个包的不同版本时，可能会出现依赖冲突。以下是解决这些冲突的一些策略：

npm-shrinkwrap.json 或 package-lock.json：这两个文件都可以锁定项目的完整依赖树，确保在不同环境中安装相同版本的依赖。npm-shrinkwrap.json是早期的解决方案，但现在更推荐使用package-lock.json。当你运行npm install时，NPM会自动生成或更新这个文件。

• 手动解决：在某些情况下，你可能需要手动编辑package.json文件来解决冲突。这可能涉及到更改特定依赖的版本，或查找与当前依赖兼容的其他包。
• 使用npm-dedupe：虽然这个命令现在已经被集成到NPM中，但在过去，npm-dedupe是一个用于减少依赖树中重复包的工具。现在，NPM默认会尝试优化依赖树，减少重复。
• 更新包：有时，简单地更新到一个包的最新版本就可以解决冲突，因为新版本可能已经解决了与其他包的兼容性问题。

2. NPM脚本

NPM脚本

在Node.js项目中，package.json文件包含了一个scripts字段，这个字段用于定义NPM脚本。NPM脚本是一组可以由NPM命令行工具执行的命令，用于自动化项目的构建、测试、部署等任务。

1. scripts字段的作用

scripts字段在package.json中定义了一系列的脚本命令，这些命令可以通过npm run <script-name>来执行。它提供了一种标准化的方式来指定项目中常见的任务，例如启动服务器、运行测试、构建项目等。通过将这些命令封装在NPM脚本中，项目成员可以方便地执行相同的任务，而无需记住复杂的命令或参数。

2. 自定义脚本命令

除了NPM提供的内置脚本命令（如start、test等），开发者还可以在scripts字段中自定义脚本命令。自定义脚本命令可以是任何可以在命令行中执行的命令或脚本文件。例如，你可以在scripts字段中添加一个build命令，用于执行项目的构建过程。

3. 脚本执行顺序与并行执行

在package.json文件中定义的NPM脚本，它们的执行顺序是按照在scripts字段中定义的顺序来依次执行的。这意味着，如果你在一个脚本中调用了另一个脚本，并且希望它们按照特定的顺序执行，你需要确保它们在scripts字段中的顺序是正确的。

然而，有时候你可能希望同时执行多个脚本，而不是等待一个脚本执行完成后再执行下一个。在这种情况下，你可以使用并行执行的方式来运行这些脚本。

并行执行可以通过在脚本命令之间使用特定的符号来实现，具体取决于你使用的操作系统和shell环境。在Unix和类Unix系统（如Linux和macOS）上，你可以使用&符号来在后台运行一个进程，从而实现并行执行。例如：

{
  "scripts": {
    "script1": "command1",
    "script2": "command2",
    "parallel": "npm run script1 & npm run script2"
  }
}

在上面的例子中，当你运行npm run parallel时，script1和script2将会同时开始执行。&符号使得script1在后台运行，而script2则在前台运行。这样，两个脚本就可以并行执行了。

然而，需要注意的是，并行执行可能会导致输出交错，因为两个脚本同时向控制台输出信息。此外，如果脚本之间有依赖关系，或者一个脚本的执行结果依赖于另一个脚本的执行结果，那么并行执行可能会导致问题。在这种情况下，你应该使用串行执行，确保脚本按照正确的顺序执行。

如果你希望脚本串行执行，即等待一个脚本执行完成后再执行下一个，你可以使用&&符号（在Unix和类Unix系统上）来连接脚本命令。例如：

{
  "scripts": {
    "script1": "command1",
    "script2": "command2",
    "serial": "npm run script1 && npm run script2"
  }
}

在上面的例子中，当你运行npm run serial时，script1将会首先执行，只有在其成功执行完成后，script2才会开始执行。这样，你就可以确保脚本按照正确的顺序串行执行了。

需要注意的是，并行执行和串行执行的选择应该根据你的具体需求和脚本之间的依赖关系来决定。如果脚本之间没有依赖关系，并且可以并行执行以提高效率，那么你可以选择并行执行。如果脚本之间有依赖关系，或者需要按照特定的顺序执行，那么你应该选择串行执行。

• npm-run-all：这是一个可以并行或串行运行多个npm脚本的工具。它提供了额外的命令，如npm-run-all -p script1 script2来并行运行script1和script2，或使用-s标志来串行运行它们。

4. 常用的NPM脚本示例

以下是一些常用的NPM脚本示例，你可以在项目中根据自己的需求进行调整：

• start: 用于启动应用程序。通常与node server.js或node app.js等命令一起使用。
• test: 用于运行项目的测试。可以与测试框架（如Jest）一起使用，例如：jest。
• build: 用于构建项目。可以与构建工具（如Webpack）一起使用，例如：webpack --config webpack.config.js。
• lint: 用于执行代码检查。可以与代码检查工具（如ESLint）一起使用，例如：eslint .。
• clean: 用于清理构建生成的文件。可以与删除工具（如rimraf）一起使用，例如：rimraf dist。
• dev: 用于开发模式，可能同时启动服务器和监视文件变化。
• prepublishOnly: 在项目发布之前执行一些准备工作，例如编译TypeScript代码或构建前端资源。

• postinstall: 在项目安装依赖后执行一些额外的操作，例如自动运行数据库迁移。

以上是一些常见的NPM脚本示例，你可以根据项目的具体需求自定义更多的脚本命令。通过合理地使用NPM脚本，可以提高项目的自动化程度，减少重复性工作，提升开发效率。

3. NPM配置

NPM（Node Package Manager）的配置是通过.npmrc文件来管理的。这个文件可以存在于多个层级：每个项目目录下、用户主目录下（对于全局配置）以及全局npm安装目录下。不同层级的配置会按照优先级进行合并，项目级别的配置会覆盖用户级别的配置，而用户级别的配置又会覆盖全局的配置。

1. NPM配置文件：.npmrc

.npmrc文件是一个简单的INI格式文件，用于存储NPM的配置项。你可以在这个文件中设置NPM的行为，比如指定注册表、设置代理、配置认证信息等。

2. 全局配置与项目配置

• 全局配置：全局配置文件通常位于用户主目录下的.npmrc文件中（例如，在Unix系统中，路径可能是~/.npmrc）。全局配置应用于该用户运行的所有NPM命令，无论在哪个项目中。

• 项目配置：项目配置文件位于项目的根目录下，与package.json文件同级。项目级别的配置只影响该特定项目的NPM命令。

3. 常用配置项详解

• registry：指定用于下载包的NPM注册表。例如，设置淘宝NPM镜像：

registry=https://registry.npm.taobao.org/

• save-exact：设置为true时，npm install --save命令将保存包的精确版本，而不是使用版本范围。例如：

save-exact=true

• proxy 和 https-proxy：用于配置NPM使用的HTTP/HTTPS代理。例如：

proxy=http://proxy.example.com:8080/
https-proxy=http://proxy.example.com:8080/

• strict-ssl：控制是否对SSL证书进行严格验证。在某些受限网络环境中，可能需要将其设置为false。例如：

strict-ssl=false

• init.author.name 和 init.author.email：设置npm init命令默认使用的作者姓名和电子邮件地址。例如：

init.author.name=Your Name
init.author.email=your.email@example.com

• package-lock：控制是否生成或更新package-lock.json文件。通常不需要手动设置，因为npm install命令会自动处理。

实际代码举例

• package-lock：控制是否生成或更新package-lock.json文件。通常不需要手动设置，因为npm install命令会自动处理。

实际代码举例

# 使用淘宝NPM镜像
registry=https://registry.npm.taobao.org/

# 保存包的精确版本
save-exact=true

# 配置代理（如果需要的话）
# proxy=http://proxy.example.com:8080/
# https-proxy=http://proxy.example.com:8080/

# 初始化时使用的默认作者信息
init.author.name=Your Name
init.author.email=your.email@example.com

现在，当你在该项目中运行npm install命令时，NPM将使用淘宝的镜像来下载包，并且会保存包的精确版本到package.json文件中。注意，代理配置部分已被注释掉，因为只有在需要时才应该取消注释并使用它们。