webpack多頁面打包配置

有幾個頁面其實就可以new幾個htmlwebpackplugin物件放到記憶體中去

webpack.common.js

const plugins =[
//htmlwebpackplugin會在打包結束後，自動生成乙個html檔案，並把打包生成的js自動引入到這個html檔案中
newhtmlwebpackplugin(),
newhtmlwebpackplugin(),
newcleanwebpackplugin()
];

**或參考：webpack多頁面打包配置

單頁面應用：整個應用裡面只有乙個html檔案。現在主流的框架，vue，react都是單頁面應用。

所以webpack絕大部分都是對單頁面打包。那麼webpack如何對多頁面進行打包

//htmlwebpackplugin會在打包結束後，自動生成乙個html檔案，並把打包生成的js自動引入到這個html檔案中

newhtmlwebpackplugin(),

newhtmlwebpackplugin(),

newcleanwebpackplugin()

];

這裡新建兩個htmlwebpackplugin。htmlwebpackplugin是用來自動生成靜態頁面用的.模板是index.html，生成的檔名是index.html和list.html，裡面植入的chunks分別是main和list。那麼實際上多個頁面就是多個htmlwebpackplugin

webpack多頁面打包

在src下新建多個js檔案和html模板 在entry裡配置多個入口檔案 entry htmlwebpackplugin裡配置不同的html頁面引用不同的js檔案 const plugins new htmlwebpackplugin new htmlwebpackplugin 但是每次在 entr...

webpack實戰 多頁面打包配置 八

在src目錄下新建list.js src index.js import react,from react import reactdom from react dom class extends component reactdom.render document.getelementbyid r...

webpack配置多頁面專案

相信經常使用webpack的人已經深刻體驗到自動化工具給我們帶來的便利。我自己最常用的是vue,平時就是使用vue cli或者nuxt構建的專案，聰明的前輩已經為我們配好了專案，可以讓我們不必去配置就可以輕鬆使用。我現在做的這個專案只有簡單的兩個頁面，不基於任何框架。about.html,conta...