webpack 基本插件(plugin)使用

一、BannerPlugin

为每个 chunk 文件头部添加 banner。类似版权声明

new webpack.BannerPlugin(banner)

二 、HtmlWebpackPlugin

• 自动生成一个 HTML5 文件；

• 自动将打包后的js文件，填到使用 script 标签中。

安装

npm install --save-dev html-webpack-plugin

配置

const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
  plugins: [
    new HtmlWebpackPlugin()
  ]
}

三、UglifyjsWebpackPlugin

• 压缩js文件，缩小体积 （生产环境使用）

安装

npm i -D uglifyjs-webpack-plugin

配置

const UglifyJsPlugin = require('uglifyjs-webpack-plugin')

module.exports = {
  plugins: [
    new UglifyJsPlugin()
  ]
}