webpack學習(四)配置plugins

凡塵yang發表於2019-06-08

1 plugins是什麼???

如果學過vue和react肯定知道生命週期函式,而生命週期函式實際上就是當程式執行在某個時刻一定會發生的函式。

plugins其實也是如此,我們在專案中配置相應的plugins就是希望在打包過程中的一些時刻,一些場景下幫助我們做

一些事情。

2 HtmlWebpackPlugin

開啟 webpack官網找到plugins一欄,我們找到最常見的 HtmlWebpackPlugin:

#HtmlWebpackPlugin#的介紹大致意思就是一句話:這個外掛可以在打包後生成一個html檔案,而這個檔案你希望是什麼樣子那麼你可以告訴webpack,就是給一個html模板

作為參照。另外如果在打包中有任何css檔案,會出現在生成的html檔案紅的head或者link中。

3 如何配置???

文件說的很清楚,配置plugin就在 配置檔案中 plugins這個關鍵字中新增 並且例項化即可。記住plugins這一項配置是陣列。

如下:

 

注:plugin需不需要加一些引數看需求而定。專案中使用哪些外掛可以先官網,或者網上查閱相關配置。

 

相關文章