學習webpack記錄(三) -开发者知识库

學習webpack記錄(三) -开发者知识库,第1张

問題1:如何打包生成多頁面的文件 

要點:入口多js文件

實例化多個htmlWebpackPlugin , 使用 chunk:['main','a'],來指定每個文件各自包含的js文件  

也可使用excludeChunks:['a','b']  除了a.js和b.js

學習webpack記錄(三) -开发者知识库,第2张

學習webpack記錄(三) -开发者知识库,第3张

學習webpack記錄(三) -开发者知识库,第4张

學習webpack記錄(三) -开发者知识库,第5张


問題2:如何實現3個html文件中main.js是直接在html文件中生成的,而a.js/b.js/c.js都是通過cdn的形式外鏈介入?

問題3:webpack 如何處理項目中的資源文件?

    3.1  ES6語法轉換為瀏覽器接收的語法

    3.2  處理css或者css預處理語言 (less scss stylus)

    3.3  圖片壓縮 、圖片轉為base64的編碼格式 減少請求

首先解析es6語法:需要安裝依賴 babel-core babel-loader

學習webpack記錄(三) -开发者知识库,第6张

學習webpack記錄(三) -开发者知识库,第7张

學習webpack記錄(三) -开发者知识库,第8张

配置wabpack.config.js

學習webpack記錄(三) -开发者知识库,第9张

解析:需要在根目錄下增加一個.babelrc文件,指定es6語言轉化為那個版本

include 里面包含需要解析的js存在范圍,極大縮端打包時間,依賴babel-loader

運行的結果

學習webpack記錄(三) -开发者知识库,第10张



最佳答案:

本文经用户投稿或网站收集转载,如有侵权请联系本站。

发表评论

0条回复