Webpack模組的使用

 

模組

在模組化程式設計中，開發者將單獨功能的程式碼分裝成模組。

每個模組體積都會比一大坨程式的體積小，使得調試和編寫變得方便。

NodeJs自創建以來就支援了模組化編程，但是在Web編程中，模組化一直很遲鈍（沒被支援），當然也有很多為了模組化而出現的Js模組化工具，它們各有優缺點。

Webpack去粗取精，繼承它們優秀的地方，使得模組化適合Web專案中的任何檔案。

什麼是Webpack模組

和NodeJs單一化的表達方式不同，Webpack可以用多種方式來完成、實作模組化的程式設計：

• ES6的import 表達

• CommonJS的require() 表達

• AMD（非同步模組定義）的define和require 表達

• CSS/SASS/LESS檔案中的@import 表達

• 樣式表或html檔案中的圖像url位址（不明？

支援的模組類型

Webpack支援用載入器來載入各種不同類型的模組，載入器會告訴Webpack這些模組是什麼（因為不是

JavaScript

模組了呀），然後會打包在一起。

支援的類型包括：

CoffeeScript

• #TypeScript

• ##ESNext (Babel)

• Sass

• Less

• Stylus

#######################################################################################################################################################。 ####等等。 Webpack支援許多Web程式的模組化打包使得開發者更容易進行Web開發。 ######相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！ ######推薦閱讀：#########事件模型的詳解###############event loop如何使用######### ###JavaSript事件冒泡與事件擷取如何實作##########

以上是Webpack模組的使用的詳細內容。更多資訊請關注PHP中文網其他相關文章！