webpack + vue 中的各种组件说明

"clean-webpack-plugin": "^0.1.19",  //用于在building之前删除你以前build过的文件
"copy-webpack-plugin": "^4.5.1",  //执行 拷贝文件和文件夹
"css-loader": "^0.28.11",  //在 webpack 中注入css
"extract-loader": "^2.0.1",  //webpack加载器从软件包中提取html和css。
"extract-text-webpack-plugin": "^4.0.0-beta.0",  //该插件的主要是为了抽离css样式,防止将样式打包在js中引起页面样式加载错乱
"file-loader": "^1.1.11",  //file-loader可以解析项目中的url引入（不仅限于css），根据我们的配置，将图片拷贝到相应的路径，再根据我们的配置，修改打包后文件引用路径，使之指向正确的文件。
"html-loader": "^0.5.5",  //将html作为字符串输出。当编译器要求时，压缩html。
"html-webpack-plugin": "^3.2.0",  //自动生成一个 html 文件，并且引用相关的 assets 文件(如 css, js, ico , img, ……)。给插入的文件加 hash，防止静态资源缓存
"less": "^3.0.1",  // less
"less-loader": "^4.1.0",  // 让less在webpack中可用
"node-gyp": "^3.6.2",  //编译某些模块，因为要跨平台，不得不编译。例如：node-sass，曾经这个玩意在公司下载不下来坑了我很长时间
"node-sass": "^4.8.3",  // sass
"source-map":"^0.7.2", // init时会慢，之后rebuild快
"postcss-loader": "^2.1.3",
/**
*用来对.css 文件进行处理，并添加在 style-loader 和 css-loader 之后。
*通过一个额外的 postcss 方法来返回所需要使用的 PostCSS 插件。
*require('autoprefixer') 的作用是加载 Autoprefixer 插件。
*
*PostCSS 本身是一个功能比较单一的工具。它提供了一种方式用 JavaScript 代码来处理 CSS。
*它负责把 CSS 代码解析成抽象语法树结构（Abstract Syntax Tree，AST），再交由插件来进行处理。
*插件基于 CSS 代码的 AST 所能进行的操作是多种多样的，比如可以支持变量和混入（mixin），
*增加浏览器相关的声明前缀，或是把使用将来的 CSS 规范的样式规则转译（transpile）成当前的 CSS 规范支持的格式。
*https://www.ibm.com/developerworks/cn/web/1604-postcss-css/
**/
"resolve-url-loader": "^2.3.0",  //
"sass-loader": "^6.0.7",  // sass 工作在 webpack中
"style-loader": "^0.20.3",  //html 中 style load
"uglifyjs-webpack-plugin": "^1.2.4",  // 压缩js
"url-loader": "^1.0.1",  //图片较多，会发很多http请求，会降低页面性能。这个问题可以通过url-loader解决。url-loader会将引入的图片编码，生成dataURl。相当于把图片数据翻译成一串字符。再把这串字符打包到文件中，最终只需要引入这个文件就能访问图片了。
/**
*url-loader封装了file-loader。
*url-loader不依赖于file-loader，即使用url-loader时，只需要安装url-loader即可，不需要安装file-loader，
*因为url-loader内置了file-loader。通过上面的介绍，我们可以看到，url-loader工作分两种情况：
*1.文件大小小于limit参数，url-loader将会把文件转为DataURL；
*2.文件大小大于limit，url-loader会调用file-loader进行处理，参数也会直接传给file-loader。
*因此我们只需要安装url-loader即可。
**/
"vue": "^2.5.16",  //
"vue-hot-reload-api": "^2.3.0",  //热替换
"vue-html-loader": "^1.2.4",  // vue 模板中 html 加载的支持
"vue-lazyload": "^1.2.2",  // vue 懒加载插件
"vue-loader": "^14.2.2",  //
"vue-resource": "^1.5.0",  //
/**
*vue-resource是Vue.js的一款插件，它可以通过XMLHttpRequest或JSONP发起请求并处理响应。
*也就是说，$.ajax能做的事情，vue-resource插件一样也能做到，而且vue-resource的API更为简洁。
*http://www.jb51.net/article/103159.htm
**/
"vue-router": "^3.0.1",  //路由
"vue-style-loader": "^4.1.0",  //vue 内部样式转码组件
"vue-template-compiler": "^2.5.16",  //vue 模板转码组件 
"vuex": "^3.0.1",
/**
*Vuex 或者说实现了 Flux 思想的库
*组件之间的数据通信
*使用单向数据流的方式进行数据的中心化管理
*
*业务过于简单，没有必要使用 vuex
*https://www.zhihu.com/question/33864532
*https://segmentfault.com/q/1010000011402824
**/
"webpack": "^4.5.0",  //
"webpack-dev-server": "^3.1.3",  //自刷新页面，更改代码后可以自动刷新，最常用的module
"webpack-merge": "^4.1.0"  //可以把分开配置的config合并，分开生产环境和调试环境