一、webpack有何用？

問題1：前端的程式碼：樣式less，瀏覽器不能讀取less檔案。

問題2：前端程式碼，es6的程式碼，部分版本低的瀏覽器只能讀取解析es5的程式碼。

問題3：前端規範 CommonJS,AMD,CMD,ES6，瀏覽器如果沒有底層支撐，則識別不了CommonJS,AMD,CMD.而部分瀏覽器可以識別ES6規範，還有瀏覽器識別不了ES6規範。

問題4：模組化的開發（css,js,jpg等檔案型別都是模組化開發），導致模組之間有複雜的依賴關係網。

問題5：grunt/gulp核心是task，（圖片壓縮，scss轉成css,es6轉換成es5）,自動化執行task但是grunt/gulp處理不了複雜的模組化開發及模組關係。

解決以上問題就需要用webpack.

二、webpack的依賴環境

Node,node環境中有一個工具 Npm,用於管理node環境下的各種包，是包管理工具

三、webpack環境安裝

1.全域性安裝

npm install [email protected] -g

2.區域性安裝

npm install [email protected] --save-dev

四、在Html引用CommonJS規範的

本文來自部落格園，作者：kaer_invoker，轉載請註明原文連結：https://www.cnblogs.com/invoker2021/p/14972938.html