总结 webpack 的插件
模块化第一步 初始化 package.json 文件
node.js 指令 npm init
npm的官网：https://www.npmjs.com/ 搜索插件名，查看插件的用法
1. webpack 虽然并没有什么突出的地方，但是他的插件却非常多且好用；
npm node包管理工具，可以对包进行 增 删 查 改
下载 npm 包的指令 npm install 包名
2. cnpm 淘宝 npm 镜像：与 npm 一样，但是比 npm 下载的快
指令：npm install -g cnpm --registry=https://registry.npm.taobao.org
3. 利用 browserify 对 js 文件，进行打包编译
下载指令：npm install browserify --save-dev
打包指令：browserify 主文件>要打包的文件
4. 利用 package.json 文件，恢复之前所下载的包
指令：npm install
5. webpack 可以对前端资源进行打包 （前端资源：js css json 图片均可打包）
下载指令：npm install webpack@3.8.1 --save-dev （--save-dev：开发环境， @指令版本号 ）
6. webpack-dev-server 可以通过ctrl+s 来进行实时刷新的插件
下载指令：npm install webpack-dev-server@2.9.4 --save-dev (webpack的附属产品，要比webpack第一个大版本，如 webpack 是3点多的版本，他的附属产品只能的2点多)
实时刷新指令：webpack-dev-server --hot --inline
7. 如果只想用 webpack 来实现一键打包，我们需要在当前目录下，创建一个 webpack.config.js 文件
文件内容的配置：https://www.cnblogs.com/shangjun6/p/10980093.html
8. 如果我们想 通过一个指令来跑我们的 node.js，我们只能通过 package.json 文件
指令：npm run dev
文件内容的配置：https://www.cnblogs.com/shangjun6/p/10980087.html
9. 想要去改相对路径变成绝对路径 我们需要用到 node 自带的插件；
指令：var path=require("path");
用法：path.resove() 方法，参数一：必填：dirname（当前目录） 参数二：必填："./指定目录下" 在 webpack.config.js中操作
10. 要自动打开浏览器的插件：open-browser-webpack-plugin
下载指令：npm open-browser-webpack-plugin --save-dev
文件内容的配置：官网搜 open-browser-webpack-plugin
11. 配置服务器：通过 devServer 属性 在webpack.config.js 文件，接口 module.exports={} 中
指定跟目录：contentBase:
指定端口：port:
12. 打包图片的插件
指令下载：npm install url-loader --save-dev 主要是针对 css 打包的背景图，不好用
插件用法：官网搜 url-loader
13. 打包 css 的插件
指令下载：npm install style-loader css-loader --save-dev
插件用法：官网搜 css-loader
14. 打包 json 的插件
指令下载：npm install json-loader --save-dev
插件用法：官网搜 json-loader
15. 打包 es6 插件（将 es6 转为 es5 ）
指令下载：npm install -D babel-loader @babel/core @babel/preset-env
插件用法：官网搜 babel-loader
16. 将 css 与 js 分离的插件
指令下载：npm install extract-text-webpack-plugin --save-dev
插件用法：官网搜 extract-text-webpack-plugin
17. less的配置：（es6写法的css文件）
指令下载：npm install less less-loader --save-dev
插件用法：官网搜 less-loader
18. 查看 node 的版本
指令：node -v
