Webpack Plugins(插件)

2023-05-15 18:01 更新

plugins 選項(xiàng)用于以各種方式自定義 webpack 構(gòu)建過(guò)程。webpack 附帶了各種內(nèi)置插件,可以通過(guò) webpack.[plugin-name] 訪問(wèn)這些插件。請(qǐng)查看 插件頁(yè)面 獲取插件列表和對(duì)應(yīng)文檔,但請(qǐng)注意這只是其中一部分,社區(qū)中還有許多插件。

plugins

?[Plugin]?

一組 webpack 插件。例如,DefinePlugin 允許你創(chuàng)建可在編譯時(shí)配置的全局常量。這對(duì)需要再開(kāi)發(fā)環(huán)境構(gòu)建和生產(chǎn)環(huán)境構(gòu)建之間產(chǎn)生不同行為來(lái)說(shuō)非常有用。

webpack.config.js

module.exports = {
  //...
  plugins: [
    new webpack.DefinePlugin({
      // Definitions...
    }),
  ],
};

一個(gè)復(fù)雜示例,使用多個(gè)插件,可能看起來(lái)就像這樣:

webpack.config.js

var webpack = require('webpack');
// 導(dǎo)入非 webpack 自帶默認(rèn)插件
var DashboardPlugin = require('webpack-dashboard/plugin');

// 在配置中添加插件
module.exports = {
  //...
  plugins: [
    new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
   // 編譯時(shí)(compile time)插件
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': '"production"',
    }),
   // webpack-dev-server 強(qiáng)化插件
    new DashboardPlugin(),
    new webpack.HotModuleReplacementPlugin(),
  ],
};


以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)