一、什么是第三方模块

别人直接写好的，可以直接使用的，第三方模块通常有多个文件组成并且被放置在一个文件夹中，所以又叫包。
第三方模块有两种形式存在：
以js文件的形式存在，提供实现多项目具体功能的API
以命令行工具的形式存在，辅助项目开发。

二、下载第三方模块

1.下载包

npm（node package manager）:node的第三方模块管理工具，可通过命令行直接操作第三方模块，下载node的时候，会自动安装npm。
输入 npm -v 命令，来查看自己电脑上所安装的 npm 包管理工具的版本号：
先要初始化包管理文件

npm init

创建pack.json文件来进行包的管理。
在命令行中输入

npm install  包名 @版本号

版本号可以不写，默认下载最新版本
就可下载指定包，默认下载当前打开命令行工具的位置。会自动创建一个node_modules文件夹，里面存放了下载的包。@后面可以根版本号。
还会多一个package-lock.json 的配置文件，它锁定了包的版本号，这样下次安装包的时候会直接读取这里的版本号安装。
其中：

• node_modules 文件夹用来存放所有已安装到项目中的包。require() 导入第三方包时，就是从这个目录中查找并加载包。
• package-lock.json 配置文件用来记录 node_modules 目录下的每一个包的下载信息，例如包的名字、版本号、下载地址等。

2.删除包

npm uninstall package 包名

3.包的本地安装和全局安装

一般命令行工具包都安装在全局，全局就是你的电脑，API安装在本地项目
-g命令就行全局安装，本地就是本项目中安装。

三、常用的第三方模块

1.nodemon

在编写调试 Node.js 项目的时候，如果修改了项目的代码，则需要频繁的手动 close 掉，然后再重新启动，非常繁琐。
命令行工具，辅助项目开发，在node.js中，每次修改完文件后，都要重新启动文件，使用这个nodemon命令启动文件，可以监控文件的变化，只要保存文件就能直接启动文件。不需要再手动启动。
1.安装

npm install nodemon -g

-g表示全局安装，在任何地方都能使用
安装好后，nodemon命令代替node来启动文件即可。

2.nrm

快速切换npm的下载包的地址
原始的npm下载地址在国外，国内下载速度慢，需要切换到国内。
1.安装

#安装到本电脑，可以给所有项目使用
npm install nrm -g

2.查看所有下载地址

nrm ls

3.选择下载地址

nrm use 下载地址
#nrm use taobao

3.gulp

1.什么是gulp

前端构建工具

2.gulp的使用
压缩html,css,js代码,合并
浏览器不是全都支持es6的需要转换成es5,，less转css,浏览器根本不认识less,需要转换css。
公共文件抽离
修改文件时浏览器自动刷新。

3.下载

npm install gulp

下载到项目
在项目根目录下新建gulpfile.js文件，文件名不要更改，在这里编写压缩，合并文件的代码。
新建src文件夹，存放源码，新建dist文件夹，存放压缩合并后的源码。

4.编写操作代码任务

gulp.src()//获取任务要处理的文件，参数可以写数组来表示选择多个文件。
gulp.dest()//输出文件
gulp.task()//建立gulp任务
gulp.watch()//监控文件的变化

步骤
1.引入gulp模块
2.建立任务
3.获取要处理的文件
4.输出要处理后的文件到dist文件
5.执行任务，而不是执行gulpfile文件，需要用到gulp-cli命令行工具来执行

const gulp = require('gulp')
gulp.task('任务名'，()=>{
 gulp.src('文件名和路径')
.pipe(gulp.dest('输出到指定地方'))

})
//.pipe是用来处理获取到的文件代码，输出到指定位置，没有的文件夹会自动创建，一般是dist下的文件夹。
//*.html表示获取所有html文件

可以建立多个任务，每个任务来处理不同的文件。

4.gulp-cli

npm install gulp-cli -g

命令行工具
管理gulp

gulp 任务名

来运行任务，他会自动取当前项目根目录下gulpfile这个文件，然后在文件中找任务名，来执行任务。

5.gulp插件

gulp提供的方法很少，压缩代码需要不同的插件来执行。

gulp-htmlmin:html文件压缩
gulp-csso:压缩css
gulp-babel:js语法转换
gulp-less:less语法转换
gulp-uglify:压缩混淆js
gulp-file-include:公共文件包含
browsersync:浏览器实时同步

使用步骤：
1.下载插件

npm install --save gulp-htmlmin来下载插件

–save已经没什么作用了，可以忽略。
2.压缩代码

const htmlmin = require('gulp-htmlmin')
gulp.task('htmlmin',()=>{
	gulp.src('./src/*.html')
		//压缩html代码，问要不要压缩空格，true就是压缩
		.pipe(htmlmin({collapseWhitespace:true}))
		.pipe(gulp.dest('./dist/demo'))

})

3.调用任务，使用gulp-cli命令

gulp htmlmin

即可成功压缩，代码被压缩成一行

其他模块同理使用。

3.抽取公共部分代码

将相同的html代码放到一个文件夹中
在需要插入的html文件写

@@include('公共代码存放的文件')

在gulpfile.js文件中

const fileinclude = requrie(gulp-file-include'')

在需要合并时写
.pipe(fileinclude ())
即可抽离并合并公共代码。

4.less语法转换和压缩css代码
步骤
1.安装gulp-less和gulp-csso
2.引入less模块和css压缩模块
3.使用模块，转换less文件

const less = require('gulp-less')
const cssmin = require('gulp-csso')
gulp.task('cssmin',()=>{
	gulp.src('./src/*.less')
	        //先把less转换成css
		.pipe(less())
	    	//再把css进行压缩
		.pipe(cssmin())
		 //输出到指定文件夹
		.pipe(gulp.dest('./dist/css'))

})

5.js文件的es6语法转换
1.安装gulp-babel
2.使用gulp-babel转换语法

npm install gulp-babel

const babel = require('gulp-babel')
gulp.task('babel',()=>{
	gulp.src('./src/*.js')
		.pipe(babel(
           {
			   //它可以判断当前代码运行的环境，将代码转换成当前运行环境所支持的代码
          presets:['@babel/env']

		   }
		))
		.pipe(gulp.dest('./dist/js'))

})

6.一次性执行多个任务

gulp.task('default',['htmlmin','cssmin','babel'])

这样执行default时，可以依次执行后面的任务。
且当任务名为default时可以命令行直接写gulp
这时gulp3.0版本的写法
4.0中换了

gulp.task('default',gulp.series(['htmlmin','cssmin'],function(){}))

6.art-template模板引擎

7.reques模块

服务器之间发送请求的模块
服务器之间没有同源政策

npm install request

const request =require('request')
request('地址'，（err,res,body）=>{
 //err是错误对象
 //res是响应信息
 //body是响应内容

})

9.babel的使用

node支持commonJS,但是对应es6的模块化规范不是很支持，所以需要使用babel插件来把高级的js语法，转换成低级的js语法，

1.安装

npm install --save-dev @babel/core @babel/cli @babel/preset-env @babel/node

上面的安装后，再安装下面的

npm install --save @babel/polyfill

2.创建babel.config.js文件

在项目根目录创建。

3.配置babel

const presets = [
           [
           //这个插件表示转换后的语法一定要支持下面的浏览器
         "@babel/env",
         {
        target :{
        edge:"17",
        //17表示版本号
        firefox:"60",
        chrome:"67",
        safari:"11.1"
     }
     }]

];
//暴露这个模块对象
module.exports = {
    presets
};

4.执行babel文件

  npx babel-node ./index.js
  //表示使用babel-node来执行当前下的index.js文件。
  //会把文件里的高级代码转换成低级js代码
  //并会执行这个js文件，相当于node ./index.js执行文件

npx是npm默认提供的，能够执行某些cli的命令
执行后会先读取自己的配置，再进行代码的转换。

四、package.json文件

项目描述文件，使用的包的目录都存放在这里。当npm install 包名时会生成这个文件，会记录下载了那些包，当node_modules文件夹被删除时，直接在项目中输入npm install会找package.json文件，根据里面记录的包重新下载包。
package.json主要记录了包的目录，版本，还有项目的作者，github地址。

1.生成package.json文件

在项目根目录下

npm init 

然后输入项目的信息，名称，版本等都有默认值，可以直接回车
或者npm init -y可以直接生成，信息值都是默认值。

2.package.json文件解析

{ 
  "name": "gulp",     //项目的名称
  "version": "1.0.0", //项目的版本
  "description": "test",//项目的描述
  "main": "gulpfile.js",//项目的主入口文件，
  "dependencies": {
    "gulp": "^4.0.2",
    "gulp-babel": "^8.0.0",
    "gulp-csso": "^4.0.1",
    "gulp-less": "^4.0.1",
    "gulp-htmlmin": "^5.0.1",
    "htmlmin": "^0.0.7"
  },//项目依赖的包，npm install --production都会会找这里的包下载。
  "devDependencies": {
  }, //开发环境依赖的包，
  
 "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
    'build': 'node index.js'//在命令行中使用npm run build将相当于使用了node index.js文件。启动了文件。字段都需要npm run 别名来执行。
  },//长命令行缩写,命令的别名
    "author": "",//项目作者
    "keywords":'',//项目的关键字
     "license": "ISC"//
}

之后新下载的包都会被记录到这个package.json文件中。

3.开发依赖和生产依赖

开发依赖的包有时包含命令行工具，而生产依赖的是不需要这些包的。所以要分开来。
开发依赖
下载

npm install 包名 --save-dev 
等价于
npm i 包名 -D

可以将包下载到devDependencies字段中
这样在不同的运行环境下，可以下载不同的依赖。开发环境直接使用npm install 来下载全部的依赖不管是开发还是生产都会下载。一般命令行工具放在开发依赖里。

生产依赖

npm install 包

默认会下载到生产依赖中，dependencies字段里。要在生产环境下只下载dependencies里的包，可以使用

npm install --production

来只下载dependencies字段里的包。

4.npm install解释

会先找项目的package.json文件，无论是开发依赖还是生产依赖都会下载下来。这样可以把项目给别人时，不用给node_modules,让别人拿到项目后自己下载。

npm install 包名

这样的下载命令会默认将包记录到dependencies字段中。

5.模块与模块之间的依赖关系（package-lock.json文件）

在下载包时，npm会同时产生另外一个文件，package-lock.json
文件。它会详细记录模块与模块之间的详细的依赖关系。每次下载新包时都会记录在里面。
这样不会因为包的版本关系而出错。
并且可以加速包的下载速度，它记录了第三方包的树状结构和包的下载地址。

五、包的分类

1.开发依赖包

npm install 包 -D    

会下载到devDependencies节点下,（被记录到 devDependencies 节点中的包，只在开发期间会用到）

2.核心依赖包

在生产环境下用到的包

npm instasll 

就会下载到dependencies节点下,（被记录到 dependencies 节点中的包，在开发期间和项目上线之后都会用到）

3.全局包

npm install 包 -g 

会把包下成全局包,全局包会被安装到 C:\Users\用户目录\AppData\Roaming\npm\node_modules 目录下。会下载到电脑里，可以给每个项目使用，而上面的两个包只能在当前项目使用。

六、包的结构

一个规范的包，它的组成结构，必须符合以下 3 点要求：

1. 包必须以单独的目录存在。即一个文件夹就是一个包。
2. 包的顶级目录下一定要有package.json文件
3. package.json必须有name,version,main这三给属性，分别代表包的名字，版本号，包的入口文件。

七、开发自己的包

1.初始化包的结构

新建一个文件夹
新增package.json 包的管理配置文件
新增index.js 包的入口文件
新增README.md 包的说明文档

2.初始化package.json

参考上面

3.在index.js文件上。

写你自己的方法，并暴露出去

4.登录npm

注意：在运行 npm login 命令之前，必须先把下包的服务器地址切换为 npm 的官方服务器。否则会导致发布包失败。

npm login

5.推送到npm上

npm publish

（注意：包名不能雷同）

6.删除包

npm  unpublish 包 --force

只能删除72小时内的包，之后不能删除了
删除的包不能在24小时内再发布。尽量不要发布无意义的包

八、包下载慢问题

因为包的服务器在国外，可以通过镜像来设置包的服务器地址选到国内的。

 # 查看当前的下包镜像源
  npm config get registry 
   # 将下包的镜像源切换为淘宝镜像源
 npm config set registry=https://registry.npm.taobao.org/
  # 检查镜像源是否下载成功
   npm config get registry