React Redux ES6 ...... 更多干货在个人主页中查看

什么是插件？

loader用于打包文件，plugins用于解决一些其他任务，比如代码压缩，去注释等等

语法

plugins:[xx1,xx2]

数组中的参数要求是插件对象的实例，即必须new

下面是一些常用的插件

代码压缩插件

UglifyJsPlugin用于将js代码压缩，尽可能减少代码体积，提升加载速度，包含了去注释

webpack内置了此插件，无需安装，使用

注 ：开发时不要使用，打包变慢

图片压缩插件

imagemin-webpack-plugin用于批量压缩图片

1 . 安装

cnpm install imagemin-webpack-plugin --save

2 . 配置

HTML重建插件

html-webpack-plugin用于创建html

有多入口的情况下，当你的 index.html引入多个js，如果这些生成的js名称构成有 [hash]，那么每次都能修改html中的js名称

Hhtml-webpack-plugin　在此可以用于自动重新生成一个index.html，已帮你把生产的所有js文件引入，生成到output目录

1 . 安装

cnpm install html-webpack-plugin --save-dev

1. 配置

清空文件夹插件

clean-webpack-plugin　可以在每次打包时先清空指定的文件夹

1 . 安装

cnpm install clean-webpack-plugin --save-dev

2 . 配置

常用的插件先介绍这些，后续有需要再介绍

【关注一下不迷路】 html css html css webpack javascript html webpack javascript css javascript css webpack

閱讀更多 全棧前端 的文章

關鍵字: 压缩 编程语言 JavaScript