# 什么是 Webpack Webpack 是一個模塊打包器。它將根據模塊的依賴關系進行靜態分析，然后將這些模塊按照指定的規則生成對應的靜態資源。  # 為什么重復造輪子 市面上已經存在的模塊管理和打包工具并不適合大型的項目，尤其單頁面 Web 應用程序。最緊迫的原因是如何在一個大規模的代碼庫中，維護各種模塊資源的分割和存放，維護它們之間的依賴關系，并且無縫的將它們整合到一起生成適合瀏覽器端請求加載的靜態資源。 這些已有的模塊化工具并不能很好的完成如下的目標： - 將依賴樹拆分成按需加載的塊 - 初始化加載的耗時盡量少 - 各種靜態資源都可以視作模塊 - 將第三方庫整合成模塊的能力 - 可以自定義打包邏輯的能力 - 適合大項目，無論是單頁還是多頁的 Web 應用 # Webpack 的特點 Webpack 和其他模塊化工具有什么區別呢？ ### 代碼拆分 Webpack 有兩種組織模塊依賴的方式，同步和異步。異步依賴作為分割點，形成一個新的塊。在優化了依賴樹后，每一個異步區塊都作為一個文件被打包。 ### Loader Webpack 本身只能處理原生的 JavaScript 模塊，但是 loader 轉換器可以將各種類型的資源轉換成 JavaScript 模塊。這樣，任何資源都可以成為 Webpack 可以處理的模塊。 ### 智能解析 Webpack 有一個智能解析器，幾乎可以處理任何第三方庫，無論它們的模塊形式是 CommonJS、 AMD 還是普通的 JS 文件。甚至在加載依賴的時候，允許使用動態表達式 `require("./templates/" + name + ".jade")`。 ### 插件系統 Webpack 還有一個功能豐富的插件系統。大多數內容功能都是基于這個插件系統運行的，還可以開發和使用開源的 Webpack 插件，來滿足各式各樣的需求。 ### 快速運行 Webpack 使用異步 I/O 和多級緩存提高運行效率，這使得 Webpack 能夠以令人難以置信的速度快速增量編譯。