webpack常用插件

1 copy-webpack-plugin

Copies individual files or entire directories, which already exist, to the build directory
webpack-copy-plugin is not designed to copy files generated from the build process; rather, it is to copy files that already exist in the source tree, as part of the build process.

## copy文件到打包的文件夹当中,只能copy已经存在的文件
2 filemanager-webpack-plugin

This Webpack plugin allows you to copy, archive (.zip/.tar/.tar.gz), move, delete files and directories before and after builds

## 文件管理插件,可以在打包前以及打包后 对所有的文件进行拷贝,压缩,移动,删除等相关操作
3 html-webpack-plugin

This is a webpack plugin that simplifies creation of HTML files to serve your webpack bundles.

## 以一个html文件为模板,生成一个html文件,并将打包生成的js文件注入当中
4 Clean plugin for webpack

By default, this plugin will remove all files inside webpack's output.path directory, as well as all unused webpack assets after every successful rebuild

## 只会移除webpack's output.path directory 目录下的文件,(比如你生成的目录是dist,那么它只会移除dist下面的文件,但是不包含dist本身)
5 webpack.ProvidePlugin

new webpack.ProvidePlugin({
    $: 'jquery',
    _: 'lodash'
})

## 垫片插件 ,当我们在代码中使用到相关的变量,但是没有引入相关的模块时,该插件会自动帮我们引入
6 add-asset-html-webpack-plugin

After webpack 4+, it is required to apply AddAssetHtmlPlugin after HtmlWebpackPlugin

## 必须要在HtmlWebpackPlugin插件之后使用它,往生成的html文件当中额外插入资源文件
7 webpack.DllReferencePlugin

new webpack.DllReferencePlugin({
    manifest: path.resolve(__dirname, './dll', file)
}), 

## 当打包第三方模块时,首先会通过这个映射去查找,查看这个模块是否被打包,如果找不到再去node_modules
不忘初心,不负梦想
原文地址:https://www.cnblogs.com/panrui1994/p/11525821.html