1.clean-webpack-plugin:由于每次打包的时候有可能文件名称不一样,打包后的文件就叠加到dist目录下了,clean-webpack-plugin作用就是在每次打包之前,先把dist目录删掉,创建最新的目录,避免不需要的文件还留在dist目录下。
安装:npm install clean-webpack-plugin -D
使用:
//引入clean-webpack-plugin的包 const { CleanWebpackPlugin } = require('clean-webpack-plugin'); //在plugins中配置 plugins: [new CleanWebpackPlugin()]
2.copy-webpack-plugin:如果我们想要把一个文件夹里的内容也拷贝到dist目录下,可以使用copy-webpack-plugin插件。
安装:npm install copy-webpack-plugin -D
使用:
const copyWebpackPlugin = require('copy-webpack-plugin'); plugins: [ new copyWebpackPlugin([ //从doc目录下拷贝到dist根目录下 //注意,如果写的是to:'./dist',则会在dist目录下再创建一个dist文件夹,然后将拷贝的文件放在里面 {from:'./doc',to:'./'} ]) ]
3.BannerPlugin:版权声明插件,是webpack自带的内置插件,不需要安装
使用:
const webpack = require('webpack'); plugins: [ //打包后这条信息就会插入到每个js文件的头部 new webpack.BannerPlugin('make 2019 by ***') ]