webpack内置插件 {ignore}

所有的webpack内置插件都作为webpack的静态属性存在的，使用下面的方式即可创建一个插件对象

  1. const webpack = require("webpack")
  3. new webpack.插件名(options)

DefinePlugin

全局常量定义插件，使用该插件通常定义一些常量值，例如：

  1. new webpack.DefinePlugin({
  2.     PI: `Math.PI`, // PI = Math.PI 此处是Math.PI 是常量的值
  3.     VERSION: `"1.0.0"`, // VERSION = "1.0.0" 此处是字符串
  4.     DOMAIN: JSON.stringify("duyi.com")
  5. })

这样一来，在源码中，我们可以直接使用插件中提供的常量，当webpack编译完成后，会自动替换为常量的值

BannerPlugin

它可以为每个chunk生成的文件头部添加一行注释，一般用于添加作者、公司、版权等信息

  1. new webpack.BannerPlugin({
  2.   banner: `
  3.   hash:[hash]
  4.   chunkhash:[chunkhash]
  5.   name:[name]
  6.   author:yuanjin
  7.   corporation:duyi
  8.   `
  9. })

ProvidePlugin

自动加载模块，而不必到处 import 或 require

  1. new webpack.ProvidePlugin({
  2.   $: 'jquery',
  3.   _: 'lodash'
  4. })

然后在我们任意源码中：

  1. $('#item'); // <= 起作用
  2. _.drop([1, 2, 3], 2); // <= 起作用