plugin===========================
vue-clipboard2
vuex-persistedstate
- 解决刷新vue页面后，store中数据丢失的问题
- https://www.npmjs.com/package/vuex-persistedstate
clean-webpack-plugin
- 清除已有的dist包，重新生成新dist包
- https://www.npmjs.com/package/clean-webpack-plugin
filemanager-webpack-plugin
- 该插件可以：创建文件夹、打zip包，复制、移动、删除操作，还可以控制上述流程顺序
- https://www.npmjs.com/package/filemanager-webpack-plugin
html-webpack-plugin
- 该插件将为你生成一个 HTML5 文件， 其中包括使用 script 标签的 body 中的所有 webpack 包。
- https://www.webpackjs.com/plugins/html-webpack-plugin/
uglifyjs-webpack-plugin
extract-text-webpack-plugin
- 它会将所有的入口 chunk(entry chunks)中引用的 *.css，移动到独立分离的 CSS 文件。因此，你的样式将不再内嵌到 JS bundle 中，而是会放到一个单独的 CSS 文件（即 styles.css）当中。
- 马上使用https://www.webpackjs.com/plugins/extract-text-webpack-plugin/
optimize-css-assets-webpack-plugin
- 压缩已抽取的css文件，删除不同组件中重复的css，优化css
- https://www.npmjs.com/package/optimize-css-assets-webpack-plugin
generate-asset-webpack-plugin
- 在dist目录下生成一个静态文件，比如生成一个json配置文件
- https://www.npmjs.com/package/generate-asset-webpack-plugin
compression-webpack-plugin
terser-webpack-plugin
- 去除 console.log
- https://webpack.docschina.org/plugins/terser-webpack-plugin/
hard-source-webpack-plugin
- 提升再次启动webpack的速度
happypack
- 将文件解析任务分解成多个子进程并发执行，发挥多核 CPU 电脑的威力
loader============================
vue-loader
- 处理.vue文件的加载器
- 其他功能，如在<style> 的部分使用 Sass 和在 <template> 的部分使用 Pug（模板引擎）
- https://vue-loader.vuejs.org/zh/
babel-loader
- 在旧的浏览器或环境中将 ECMAScript 2015+ 代码转换为向后兼容版本的JavaScript 代码
- https://babel.docschina.org/docs/en/
css-loader
- css-loader 解释(interpret) @import 和 url() ，会 import/require() 后再解析(resolve)它们。
- 马上使用 https://www.webpackjs.com/loaders/css-loader/
- 引用资源的合适 loader 是 file-loader和 url-loader，
file-loader
- 引导webpack将引入的资源，生成文件并返回资源地址（返回的是文件的路径）
- 把文件（img的src引用的图片路径或者background中引用的图片路径）输出到一个文件夹中，在代码中通过相对URL去引用输出的文件
- 默认情况下，生成的文件的文件名就是文件内容的 MD5 哈希值并会保留所引用资源的原始扩展名。
- 马上使用https://www.webpackjs.com/loaders/file-loader/
url-loader
- 将小型资源（图片、音视频、字体文件）转为base64 URL 进行加载，减少http请求（返回的是文件的base64编码）
-
url-loader功能类似于file-loader，但是在文件大小（单位 byte）低于指定的限制时，可以返回一个 DataURL。 - url-loader内部封装了file-loader，文件小于limit值时，转为DataURL，文件大于limit时，会使用file-loader进行处理。
image-loader
- 加载且压缩图片文件
sass-loader/less-loader
- 让你在写css样式时可以使用样式嵌套、使用变量、使用函数等语法
https://www.webpackjs.com/loaders/sass-loader/
postcss-loader
- 一个通过js转换css的工具，例如自动添加浏览器前缀、转换类名为全局唯一、css语法检查，配置source-map选项等
- 生成带有css位置信息的css文件
https://www.webpackjs.com/loaders/postcss-loader/
cache-loader
- 在一些性能开销较大的 loader 之前添加 cache-loader，能将结果缓存到磁盘里。保存和读取这些缓存文件会有一些时间开销，所以请只对性能开销较大的 loader 使用。
- 会在 node_modules 目录下生成一个 .cache 目录缓存文件内容，且二次打包速度显著提升
thread-loader
- 在单独的进程中，运行一些耗时的loader
