Webpack插件

2023-05-22 09:56 更新

Webpack 擁有豐富的插件接口。webpack 自身的大部分功能都使用這些插件接口。這使得 webpack 很靈活。

插件 描述
BannerPlugin 為每個 chunk 文件頭部添加 banner
CommonsChunkPlugin 提取 chunk 之間的公共模塊用以共享
CompressionWebpackPlugin 準(zhǔn)備好用 Content-Encoding 格式傳送的壓縮版資源包
ContextReplacementPlugin 重寫 require 表達(dá)式的推斷上下文
CopyWebpackPlugin 復(fù)制某個文件或整個文件夾到生成目錄中
DefinePlugin 允許創(chuàng)建一個在編譯時可配置的全局常量
DllPlugin 拆分 bundles，從而大幅減少構(gòu)建時間
EnvironmentPlugin 在 process.env 鍵上使用 ?DefinePlugin? 的簡寫方式
EslintWebpackPlugin webpack 的 ESLint 插件
HotModuleReplacementPlugin 啟用熱更新 (HMR)
HtmlWebpackPlugin 快速創(chuàng)建 HTML 文件來服務(wù) bundles
IgnorePlugin 從 bundles 包中移除某些模塊
LimitChunkCountPlugin 設(shè)置 chunk 的最小/最大限制，以便更好的控制 chunk
MinChunkSizePlugin 確保 chunk 大小在指定限制之上
MiniCssExtractPlugin 為每一個包含了 CSS 的 JS 文件創(chuàng)建一個 CSS 文件
NoEmitOnErrorsPlugin 出現(xiàn)編譯錯誤時，跳過輸出階段
NormalModuleReplacementPlugin 替換與正則表達(dá)式匹配的資源
NpmInstallWebpackPlugin 開發(fā)時自動安裝缺少的依賴
ProgressPlugin 報告編譯進(jìn)度
ProvidePlugin 使用模塊但無需使用 import/require
SourceMapDevToolPlugin 對 source map 進(jìn)行更細(xì)顆粒度的控制
EvalSourceMapDevToolPlugin 對 eval source map 進(jìn)行更細(xì)顆粒度的控制
TerserPlugin 在你的項目中使用 Terser 插件來壓縮 JS

查找更多第三方插件，請參閱 awesome-webpack。


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

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號