Node.js中的 npm , package.json以及npx

npm 包管理器

什么是 npm

就是 你配吗？ 开玩笑的 。全称 ： node package manager ， 中文叫 node 包管理器。

它起初是作为下载和管理 Node.js 包依赖的方式，但其现在也已成为前端 JavaScript 中使用的工具。

但其实它也是一个包 。不过它很强大 ，成为包老大 ，手下一群小弟（其他）。通过 npm 即能管理其他包 ，也能管理自己（通过 npm 管理 npm）。

npm 能干什么

1. 下载

npm 可以下载并安装第三方库 。

下载命令

• 安装所有依赖

npm install

如果项目具有 package.json 文件 , 通过 运行 npm install 它会在 node_modules 文件夹（如果尚不存在则会创建）中安装项目所需的所有东西。

install 可以简写成 i （下同）

npm i axios

• 安装单个包

npm install 包名

如项目里安装 axios , jquery 等

npm install axios
npm install jquery

• 安装多个包

npm install 包名1 包名2

注意包名之间没有逗号

开发时依赖和生产时依赖

在下载依赖包时 （除去安装所有），一般我们会在末尾加上标志。（不添加默认是 --save）

• --save ： 安装并添加条目到 package.json 文件的 dependencies。
• --save-dev ： 安装并添加条目到 package.json 文件的 devDependencies。

如 ：

npm install less-loader --save-dev

也可以将标志写在包名前

npm install --save axios 

主要区别是 ：

dependencies 是运行时依赖 ，无论开发还是发布出去后都需要使用，如 axios

devDependencies 是开发时依赖 ，仅开发时需要 ，发布后不需要。如 less-loader 。在打包后它会把 less 代码转换成 css 。因此最后发布出去的是 css 。那么 less-loader 就不需要了。

除此外 ， 还有其他标志

• --global : 全局安装 ，会根据环境变量找到安装目录。使用时也是根据环境变量找到目录。(简写 -g)

2. 版本控制

更新

• npm update : 更新全部依赖 （默认最新版本）。

• npm update 包名 [包名2 ,包名3 ,...] ： 更新单个或多个包 。[] 表示可选

• npm install 包名 [包名2 ,包名3 ,...] : install 时不指定版本会默认下载最新的 。如果已经下载了会更新到最新版本。

指定版本

可以在包名后直接添加相关控制版本的命令：

• @版本

下载指定的版本 。如npm i axios@0.23.0 表示下载 0.23.0 版本的 axios 包。

• @“>=版本”

下载的版本需要大于等于命令里的版本 。

小于等于也可以使用 。也可以指定范围 @">=0.7.1<0.8.6"

• ^版本

这个的意思是可接受的版本在指定版本的可变范围内。

如 ^2.5.6 则 2<=2<3 的版本 都是可以的 。

3. 任务执行

npm 不仅仅可以管理包 ，也可以执行命令 。

通过 npm run 任务名称 执行任务

如 ：

npm run server 运行项目

npm run build 打包项目

在不同的框架里有不同的命令 。也可以在 package.json 里配置命令。

其他常见指令

• npm uninstall 包名

卸载依赖包

• npm init [-y]

初始化包描述文件 。也就是 package.json 文件。可以配置项目名称。项目版本 。项目依赖也会被添加到这里。

-y 标志着快速创建，省略了手动初始化的过程。

• npm config list

查看 npm 的配置表

• npm list

查看安装的所有依赖包 ， 加上 -g 标志 则是查看使用全局安装的依赖包。

cnpm

什么是 cnpm

淘宝镜像

它具有 npm 一样的功能 。下载指令也一样。

那为什么使用它？我们先了解 npm 有什么问题。

npm 下载包时会给 npm 的服务器发送一个请求。这个请求根据你要下载的包找到对应的资源并响应。

但这个服务器在国外。因此可能面临着两个问题

1. 下载速度慢

2. 被墙。连接不到服务器。

为解决这个问题。淘宝的开发团队把 npm 服务器里的 包 在国内做了一个备份。

那么我们下载时只需要在国内的服务器下载即可。就解决了那两个问题了。

安装淘宝镜像

npm install --global cnpm  // -- global 是全局安装

然后下载更新包时 就用 cnpm 代替 npm 就行了。

cnpm install axios

配置镜像

也可以不安装，同样可以使用淘宝镜像。

有两种配置方法

• 第一种是下载时配置

npm install 包名 --registry=https://registry.npm.taobao.org

下载该包时会使用淘宝镜像

• 第二种是永久配置。每次下载都会自动使用淘宝镜像

npm config set registry https:/registry.npm.taobao.org

通过 npm config list 可查看是否配置成功

恢复

npm config set registry https://registry.npmjs.org

package.json

package.json 文件是项目的清单。它存储项目的许多信息， 它也可以做很多完全互不相关的事情。 例如，它是用于工具的配置中心。 它也是 npm 和 yarn 存储所有已安装软件包的名称和版本的地方。

这个文件不是必须的，也就是我们删掉，项目一样能跑起来。但如果配置这个文件，需要注意一定是 JSON 格式。

文件部分结构：

{
  "name": "project_name",  // 描述项目的名称
  "version": "1.0.0",   // 版本
  "author":"name",		// 作者名
  "contributors": ['a','b'], // 贡献者
  "description": "description",  // 简单的描述此项目
  "main": "src/main.js",    // 项目入口文件，
  "private": true,  // 是否隐私 ，如果为 true ，可防止项目被意外发布到 npm 。
  "repository": "url",  //  指定了此程序包仓库所在的位置
    
  // 定义一组可悲 node 运行的脚本 。
  "scripts": {   
   // 自定义指令 : "实际指令或脚本" （配置自定义指令可以简化输入命令的字数，易于记忆）
    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
    "start": "npm run dev",
    "unit": "jest --config test/unit/jest.conf.js --coverage",
    "test": "npm run unit",
    "lint": "eslint --ext .js,.vue src test/unit",
    "build": "node build/build.js"
  },
    
  // 项目开发和生成时依赖
  "dependencies": {
    "express": "^4.17.1",
    "express": "^4.17.1",
  },
    
  // 项目开发时依赖
  "devDependencies": {
    "autoprefixer": "^7.1.2",
    "babel-core": "^6.22.1",
    "babel-eslint": "^8.2.1",
  //	...
  },
    
  // 置了此软件包/应用程序在哪个版本的 Node.js 上运行
  "engines": {
    "node": ">= 6.0.0",
    "npm": ">= 3.0.0"
  },
   
   // 用于告知要支持哪些浏览器（及其版本）。
  "browserslist": ["> 1%", "last 2 versions", "not ie <= 8"],
    
  "license": "MIT"  // 指定软件包的许可证。
}

以上所有的这些属性都可被 npm 或其他工具使用。正如我们并不是在使用 node 时才会有 package.json 文件。

为什么需要 package.json 文件

1. 它记录了项目的的项目的配置信息，如名称，作者，版本，依赖等等。

2. 它简化了我们执行文件的输入的命令。也就是配置的 script 字段。

3. 它记录的项目的依赖，让我们提供 npm install 即可以下载或更新依赖，即使我们当前把依赖包删除了或者项目是来自其他人。

4. 它能配置项目的一些需要的功能，如跨域时的代理。

package-lock.json

在版本 5 中，npm 引入了 package-lock.json 文件。

该文件旨在跟踪被安装的每个软件包的确切版本，以便产品可以以相同的方式被 100％ 复制（即使软件包的维护者更新了软件包）。

简而言之， package.json 里的依赖项的版本不是准确的，可能是一个范围。

如 ~3.1.0 则 3.1.0到 3.2.0 以前的版本都可以。那么 npm install 安装的依赖可能与你实际需要的版本不一致。可能出现问题也可能不会（一般不会） 。

而 package-lock.json 则会把当前项目使用的依赖的确切版本记录下来， 它会跟随项目上传到仓库，其他使用者通过 npm install 安装依赖时着会通过 此文件安装确切的依赖版本。

如果项目里的依赖更新了 ， package-lock.json 记录的版本也会更新。

npx

npx 可以运行使用 Node.js 构建并通过 npm 仓库发布的代码。

它可以代替 npm 执行本地命令。

最亮眼的功能是它不需要本地安装依赖包就可以使用依赖 。

但实际上是下载了的，只不过会立即删除 ，也就是只要我够快 ，你就没感觉的这个意思

但它不是都会这样 ，默认情况下会找局部，找全局 ，没有再下载，然后删除。

比如我们可以不安装 vue-cli 。但提供 npx @vue/cli create my-vue-app 搭建 vue 项目。

通过 @ 可以指定版本。

npx 不限于 npm 仓库里发布的软件包 ， github gist 中的代码也可以通过 npx 和 包的 url 来允许

npx https://.......

最简单的一个例子就是 ：

直接创建一个 test 文件夹，然后不需要安装 cowsay 包 ，直接通过 npx 就可以执行了 。