Node入门教程(7)第五章：node 模块化(下) npm与yarn详解

Node的包管理器

JavaScript缺乏包结构的定义，而CommonJS定义了一系列的规范。而NPM的出现则是为了在CommonJS规范的基础上，实现解决包的安装卸载，依赖管理，版本管理等问题。

CommonJS是一个致力于构建统一的JS生态系统，它能够兼容web服务器、桌面应用、命令行应用、浏览器等。它定义了各类开发的规范和API不只仅模块化相关的规范）
官网的说明： a group with a goal of building up the JavaScript ecosystem for web servers, desktop and command line apps and in the browser.

CommonJS的模块主要以下：

• binary: Binary Data Objects (byte arrays and/or strings) (proposals, discussion, early implementations)
• encodings: Encodings and character sets (proposals, discussion, early implementations)
• io: I/O Streams (proposals, discussion)
• fs, fs-base: Filesystem (proposals, discussion, early implementations)
• system: System Interface (stdin, stdout, stderr, &c) (1.0, amendments proposed)
• assert, test: Unit Testing (1.0, amendment proposals pending)
• sockets: Socket I/O TCP/IP sockets (early proposals)
• event-queue: Reactor Reactor/Event Queue (early proposals)
• worker: Worker Worker (concurrent shared nothing process/thread) (proposal)
• console: console (proposal)

包结构

一个符合CommonJS规范的包应该是以下这种结构：

• 一个package.json文件应该存在于包顶级目录下
• 二进制文件应该包含在bin目录下。
• JavaScript代码应该包含在lib目录下。
• 文档应该在doc目录下。
• 单元测试应该在test目录下。

package.json 说明

package.json文件就是当前项目或者包（js模块、组件）的配置文件，全部当前项目的依赖的第三方模块，当前项目的配置等都定义在package.json文件中，当前它有必定的规范，咱们能够经过npm命令初始化和建立package.json文件。

建立package.json文件步骤：

# 打开命令行，确保您已经安装好了node mkdir demos cd demos # 初始化当前项目的package.json文件，-y表示默认参数。 npm init -y  ######当前demos目录下就会增长一个package.json文件，内容以下：###### { "name": "demos", // 项目名称 "version": "1.0.0", // 项目的版本号 "description": "", // 项目描述 "main": "index.js", // 引用目录模块的入口文件 "scripts": { // 能够经过npm运行的shell命令脚本 "test": "echo \"Error: no test specified\" && exit 1" // 能够经过npm run test 启动 }, "keywords": [], // 项目的关键词 "author": "", // 做者，通常能够写上邮箱 "license": "ISC" // 当前项目或者包的开源协议 } 

package.json文件说明：

• name。包名，须要在NPM上是惟一的。不能带有空格。

• description。包简介。一般会显示在一些列表中。

• version。版本号。一个语义化的版本号（http://semver.org/ ），一般为x.y.z。

  • x(Major): 主版本号：当你作了不兼容的 API 修改,通常一个比较完整大改版，须要修改x（通常增长1）
  • y(Minor): 次版本号：当你作了向下兼容的功能性新增
  • z(Patch): 修订号：当你作了向下兼容的问题修正。
  • 其余参考中文翻译

• keywords。关键字数组。用于NPM中的分类搜索。

• maintainers。包维护者的数组。数组元素是一个包含name、email、web三个属性的JSON对象。

• contributors。包贡献者的数组。第一个就是包的做者本人。在开源社区，若是提交的patch被merge进master分支的话，就应当加上这个贡献patch的人。格式包含name和email。如：

  "contributors": [{ "name": "Jackson Tian", "email": "mail @gmail.com" }, { "name": "fengmk2", "email": "mail2@gmail.com" }], 

• bugs。一个能够提交bug的URL地址。能够是邮件地址（mailto:mailxx@domain），也能够是网页地址（http://url）。

• licenses。包所使用的许可证。

• repositories。托管源代码的地址数组。

• dependencies。当前包须要的依赖。这个属性十分重要，NPM会经过这个属性，帮你自动加载依赖的包。

参考一个express框架的的包配置文件：

// 如下包，并非完整的，我截取了部份内容。 { "name": "express", "description": "Fast, unopinionated, minimalist web framework", "version": "4.16.3", "author": "TJ Holowaychuk <tj@vision-media.ca>", "contributors": [ "Aaron Heckmann <aaron.heckmann+github@gmail.com>", "Ciaran Jessup <ciaranj@gmail.com>", ], "license": "MIT", "repository": "expressjs/express", "homepage": "http://expressjs.com/", "keywords": [ "express", "framework", ], "dependencies": { "accepts": "~1.3.5", "array-flatten": "1.1.1", "statuses": "~1.4.0", "type-is": "~1.6.16", "utils-merge": "1.0.1", "vary": "~1.1.2" }, "devDependencies": { "after": "0.8.2", "cookie-parser": "~1.4.3", "cookie-session": "1.3.2", "ejs": "2.5.7", "connect-redis": "~2.4.1", "vhost": "~3.0.2" }, "engines": { "node": ">= 0.10.0" }, "files": [ "LICENSE", "History.md", "Readme.md", "index.js", "lib/" ], "scripts": { "lint": "eslint .", "test": "mocha --require test/support/env --reporter spec --bail --check-leaks --no-exit test/ test/acceptance/", } } 

npm进行包管理

npm(node package manager)原本是Node.js的包管理工具，但随着JS这几年的蓬勃发展, npm已经再也不局限于node平台，尤为是Webpack的普遍应用，前端包管理基本由npm统一管理了。

npm相关学习资源：

• npm[官网(https://www.npmjs.com/)
• npm中文文档

npm安装本地包

安装第三方包到本地，只须要打开命令行，经过cd命令进入咱们项目的根目录(确保您以前已经初始化了package.json文件)。
而后执行npm的install命令，以下：

语法：npm install <package> --save-prod

$ cd demos $ npm install lodash --save-prod # 输出以下： npm notice created a lockfile as package-lock.json. You should commit this file. + lodash@4.17.5 # 有个+号，表明安装当前。 added 1 package in 1.091s # 这里告诉咱们天津一个包用了1.091秒 

解释：

• install: 表明安装第三方包的意思，能够直接用 i代替。
• --save-prod: 表明把当前安装包的配置写入到当前package.json文件中, 能够用 -P代替。

咱们项目文件夹会有两个变化：第一个就是增长了package.json文件和node_modeules文件夹

如下是package.json的增长的内容

{
  "name": "demos", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "keywords": [], "author": "", "license": "ISC", + "dependencies": { // 增长 + "lodash": "^4.17.5" // 增长lodash的安装包 + } // 增长 } 

node_modeules文件夹存放咱们刚刚安装包的文件。

命令简写的形式：

$ npm install lodash --save-prod $ npm i lodash -P ################################################## ## 老版本中 --save 或者 -S，如今还支持,但建议用-P代替## ################################################## $ npm i lodash -S $ npm install lodash --save 

安装开发阶段依赖的本地包

有时候咱们须要一些第三方的包，仅仅在开发阶段依赖，则须要把npm的install命令添加--save-dev参数。

例如，咱们开发阶段须要用gulp进行打包，则须要安装gulp包。

$ npm install gulp --save-dev # 如下是简写形式， -D === --save-dev $ npm i gulp -D 

开发依赖，会在package.json文件的devDependencies下添加安装包的配置。以下所示：

{
  "name": "demos", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "keywords": [], "author": "", "license": "ISC", "dependencies": { "lodash": "^4.17.5" }, + "devDependencies": { + "gulp": "^3.9.1" + } } 

自动根据配置package.json文件下载安装依赖的包

package.json文件能够帮咱们进行包的管理和配置，若是在项目根目录下直接运行npm install,npm会自动的根据package.json文件中的dependencies和devDependencies中配置的第三方包进行安装。这尤为是在团队开发和项目部署时很是有用。

只须要： npm i

package.json文件中对模块的依赖可使用~、^、*来控制。

• ~: 安装兼容模块新发布的补丁版本，也就是说主版本号和次版本号不能变，最后一位修改号（补丁）可变化。例如：~1.1.0
• ^: （默认）主版本号不能变，后面两个版本可变，兼容模块新发布的次版本、补丁版本：^1.1.0
• *: 兼容模块新发布的大版本、小版本、补丁版本：任何版本均可以。

设置国内镜像

npm安装的包的时候，先检查本地是否有缓存，若是最近刚安装过，并且本地有缓存的话，直接用缓存。若是没有缓存会到npm的在线仓库下载并安装。默认的仓库地址：https://registry.npmjs.org/.

可是因为服务器在国外，并且国内你懂得，有时候下载比较大点的第三方包会很是慢，并且常常断掉。建议使用国内比较稳定快速的镜像，好比淘宝的npm镜像。

设置npm下载包的镜像为淘宝的镜像，设置方式：

打开终端(windows下请使用powershell)

# 设置淘宝镜像 $ npm config set registry https://registry.npm.taobao.org  # 验证是否配置成功 $ npm config get registry # 输出以下则表示成功： https://registry.npm.taobao.org/ 

另一种办法：用cnpm替代npm。

# 首先安装cnpm： $ npm install -g cnpm --registry=https://registry.npm.taobao.org  # 使用 $ cnpm install expresstall express 

控制安装的版本号

咱们经过npm安装第三方包的时候，能够指定安装的具体版本，在包的后面添加一个@符号和具体版本号就能够了。

# 安装0.1.1版本的sax $ npm install sax@0.1.1 # 安装最新的sax $ npm install sax@latest  # 还能够指定范围 $ npm install sax@">=0.1.0 <0.2.0" 

安装全局依赖的包

有些包不只仅须要咱们本地开发运行时依赖，有时候也须要咱们在命令行的任意位子启动和使用第三方包，那么就须要进行全局安装。
语法： npm install -g <package>
好比，gulp咱们有时候在任何一点地方均可能用到gulp命令工具，则须要全局安装gulp。

$ npm install gulp --global # 简写 $ npm i -g gulp  # 安装成功后，咱们就能够随时随地均可以运行gulp命令了 $ gulp -v 

更新安装包

更新本地的安装包：在 package.json 文件所在的目录中执行 npm update 命令。
更新全局的安装包：

$ npm update -g jshint 

卸载安装包

卸载本地安装包

$ npm uninstall --save-prod lodash # 简写 $ npm un -P lodash 

卸载全局安装包

$ npm uninstall -g lodash 

其余npm经常使用命令

更新升级npm

$ npm i npm 

罗列出当前安装的全部的包

$ npm list  # 控制列出全部包的目录层级 --depth 控制层级 $ npm list --depth=0  # 能够用ls 替代 list $ npm ls --depth=1  # 罗列全局的安装的包 $ npm -g list --depth=0  # 如下是个人安装的包 /usr/local/lib ├── autoprefixer@7.2.3 ├── babel-cli@6.18.0 ├── bower@1.8.2 ├── create-react-app@1.0.2 ├── egg-init@1.9.0 ├── eslint@3.12.2 ├── generator-keystone@0.5.1 ├── grunt-cli@1.2.0 ├── gulp@3.9.1 ├── json-server@0.12.1 ├── live-server@1.2.0 ├── n@2.1.5 ├── nodemon@1.11.0 ├── npm@5.6.0 ├── npm-check@5.4.0 ├── npm-check-updates@2.8.8 ├── parcel-bundler@1.4.1 ├── sails@0.12.13 ├── static-server@2.0.5 ├── typescript@2.2.1 ├── vue-cli@2.9.3 ├── vue-migration-helper@1.1.1 ├── UNMET PEER DEPENDENCY webpack@>=1.3.0 <3 ├── webpack-dev-server@1.16.2 └── yo@1.8.5 

npm后续

• 发布npm包

npm不只仅能够帮助咱们进行安装第三包，咱们也能够本身发布一个包，供全世界的开发人员使用。
这块内容能够，查看官网的npm publish部分。

• npm scripts 使用

咱们能够经过npm编写一些使用频率很是高的：打包、运行测试、运行部署等shell命令到package.json文件的 scripts配置节点，方便咱们执行一些复杂的重复性很高的任务。
具体学习：请移步阮一峰老师的教程。

如下只是简单介绍一下原理和使用：

npm 脚本的原理很是简单。每当执行npm run，就会自动新建一个 Shell，在这个 Shell 里面执行指定的脚本命令。所以，只要是 Shell（通常是 Bash）能够运行的命令，就能够写在 npm 脚本里面。

好比：

// package.json文件 { // ... "scripts": { "dev": "gulp dev" // 经过npm run dev 能够直接在shell中执行gulp dev命令。 } } 

在scripts中定义的脚本，咱们能够直接经过npm run <keyname>运行，跟在shell中运行同样。

常见的通常使用技巧：

// package.json文件
{
  // ...
  "scripts": {
    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
    "start": "npm run dev",
    "unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run",
    "test": "npm run unit",
    "lint": "eslint --ext .js,.vue src test/unit",
    "build": "node build/build.js"
  }
}
 # 如下是执行对应的任务 npm run build # 运行打包任务 npm run dist # 运行生成dist目录文件的命令 npm run dev # 运行开发调试 npm run test # 运行测试  # 如下有几个内置的能够简写： npm start # => npm run start npm stop # => npm run stop的简写 npm test # => npm run test的简写 

yarn 是npm以外的另外一种选择

yarn是Facebook出的一款替代npm的包管理工具，npm的功能它都有对应，并且使用方法也都很类似。那为何Facebook再造一个重复的轮子呢？

在yarn以前的npm版本的问题：(固然部分问题已经修复)

• npm 安装包（packages）的速度不够快，是顺序下载，不是并行。
• 拉取的 packages 可能版本不一样（最新的版本已经能够把版本锁住：package-lock.json）
• npm 容许在安装 packages 时执行代码，这就埋下了安全隐患

yarn能兼容npm的配置文件package.json，使用方式也很是接近npm，因此咱们能够基本上无缝从npm迁移到yarn。并且yarn的确的确够快、够稳定、够优秀。yarn的优势：

• 速度快：Yarn 缓存了每一个下载过的包，因此再次使用时无需重复下载。 同时利用并行下载以最大化资源利用率，所以安装速度更快。并行下载安装包，速度真的是杠杠的。
• 比较安全：在执行代码以前，Yarn 会经过算法校验每一个安装包的完整性。
• 可靠：使用详细、简洁的锁文件格式和明确的安装算法，Yarn 可以保证在不一样系统上无差别的工做。
• 无论安装顺序如何，相同的依赖关系将在每台机器上以相同的方式安装。
• 将依赖包的不一样版本归结为单个版本，以免建立多个副本。
• 重试机制确保单个请求失败并不会致使整个安装失败。

yarn的安装

mac下安装：

brew install yarn

windows安装：直接下载安装包。

测试是否安装成功：

yarn --version
# 如下输出的是yarn的版本号，笔者的是以下，你的可能跟我不同。 0.24.5 

npm和yarn的cli差别

如下只是简单介绍一下yarn的使用方法：

初始化一个新的项目

yarn init
# 对应npm npm init 

添加一个依赖包

yarn add [package]
yarn add [package]@[version]
yarn add [package]@[tag]
# 对应npm npm install [package] 

更新一个依赖包

yarn upgrade [package]
yarn upgrade [package]@[version]
yarn upgrade [package]@[tag]
 # 对应npm npm update [package] 

删除一个依赖包

yarn remove [package]
# 对应npm npm uninstall [package] 

安装全部的依赖包

yarn
or
yarn install
 # 对应npm npm install 

全局安装依赖包

yarn global add [package]
npm i [package] -g

yarn global remove [package]
npm un [package] -g

yarn upgrade [package]
npm update [package]

注意：yarn全局安装了一些命令包以后，可能全局范围内不能访问，这时候须要把yarn的全局的bin目录加入到操做系统的环境变量中。

# 查看yarn的全局bin目录 yarn global bin  # 输出（mac下） /usr/local/Cellar/node/9.9.0/bin 

总结

至此，咱们已经基本掌握了nodejs的包管理、包加载机制等基本原理，后面就是咱们怎么应用他们进行开发了。

---

参考：

深刻浅出Node.js（三）：深刻Node.js的模块机制

Yarn 中文网

阮一峰老师的教程

---

老马免费视频教程

返回教程列表首页

github地址：https://github.com/malun666/aicoder_node