【Webpack 雜談】幫助文檔翻譯：Webpack的模塊
阿新 • • 發佈：2018-03-18
加載器 coffee ejs 什麽是 異步 項目 htm 優秀 模塊
頁面出自Webpack官方文檔（撰寫時，是v4.1.1）
其實Webpack本身有中文文檔，不知道是誰去撰寫的，但是自己翻譯一遍感覺更好理解。
https://webpack.js.org/concepts/modules/
模塊
在模塊化編程中，開發者將單獨功能的代碼分裝成模塊。
每個模塊體積都會比一大坨程序的體積小，使得調試和編寫變得方便。
NodeJs自創建以來就支持了模塊化編程，但是在Web編程中，模塊化一直很遲鈍（沒被支持），當然也有很多為了模塊化而出現的Js模塊化工具，它們各有優缺點。
Webpack去粗取精，繼承它們優秀的地方，使得模塊化適合Web項目中的任何文件。
什麽是Webpack模塊
和NodeJs單一化的表達方式不同，Webpack可以用多種方式來完成、實現模塊化的編程：
- ES6的 import 表達
- CommonJS的 require() 表達
- AMD（異步模塊定義）的 define 和 require 表達
- CSS/SASS/LESS文件中的 @import 表達
- 樣式表或html文件中的圖像url地址（不明？）
Webpack 1代需要特定的加載器完成ES6的 import 表達，但是Webpack 2代就原生支持了。
支持的模塊類型
Webpack支持用加載器來加載各種不同類型的模塊，加載器會告訴Webpack這些模塊是什麽（因為不是JavaScript模塊了呀），然後會打包在一起。
支持的類型包括：
- CoffeeScript
- TypeScript
- ESNext(Babel)
- Sass
- Less
- Stylus
等等。Webpack支持很多種Web編程的模塊化打包使得開發者更容易進行Web開發。
加載器的全部列表如下：點我
【Webpack 雜談】幫助文檔翻譯：Webpack的模塊