原文地址：https://webpack.js.org/concepts/loaders/
載入器是應用于你的應用裡原始程式碼， 實現轉換。 它們是函數（運行於Node.js）， 用原始檔案作為參數， 生成新檔。
例子
例如， 使用載入器來告訴webpack載入CSS檔， 或者把TypeScript轉換為Javascript。
首先， 安裝對應的載入器：
npm install --save-dev css-loader npm install --save-dev ts-loader然後， 在webpack.config.js裡進行配置， 對每一個.css檔使用css-loader， 類似的對.ts檔使用ts-loader。
module.exports ={ module:{ rules:[ {test:/.css$/, use: 'css-loader'}, {test:/.ts$/, use: 'ts-loader'} ] } };注意， 根據配置選項的定義， 下面的方式定義了同樣的載入器用法：
{test:/.css$/, loader:'css-loader'} // or equivalently {test:/.css$/, use:'css-loader'} // or equivalently {test:/.css$/, use:{ loader:'css-loader', options:{} }}配置
在你的應用裡使用載入器有三種方式：
通過webpack.config.js
module.rules允許你在webpack配置裡指定多個載入器。 這是一個簡潔的顯示載入器的方法， 並且可以幫助你維護整潔的代碼。 它也提供了每一個載入器的整體概述。
通過require
可以通過require聲明來制定載入器（或者define， require.ensuse等等）。 用!（嘆號）分割出載入器， 每一個部分都是相對於目前的目錄被解析。
require('style-loader!css-loader?modules!./styles.css');規則整體加首碼!（嘆號）， 就可以覆蓋在配置裡定義的任何載入器。
選項可以通過查詢參數來傳遞， 就像在互聯網上（?key=value&foo=bar）。 還可以使用json物件（?{"key":"value","foo":"bar"}）。
通過CLI
還有一種選擇， 你可以通過CLI使用載入器。
webpack --module-bind jade-loader --module-bind 'css=style-loader!css-loader'對.jade檔使用jade-loader， 對.css檔使用style-loader和css-loader.
載入器的特性載入器可以鏈式使用， 他們被適用於對應原始程式碼的管道裡。 按照先後順序來編譯一個載入器鏈。 載入器鏈裡第一個載入器返回一個值給下一個載入器。 Webpack期待最後一個載入器返回JavaScript。 載入器可以是同步的， 也可以是非同步的。 載入器運行在Node.js中。 所以Node.js裡可以實現的載入器都可以實現。
載入器通過預處理函數（載入器）可以在JavaScript生態系統中貢獻更多。 用戶現在可以更靈活的加入諸如壓縮， 大包， 翻譯等細分處理。
解析載入器
載入器依從標準的模組解析。 多數情況下你講從模組路徑（想想npm install, node_modules）裡得到載入器。
怎樣去寫一個載入器？一個載入器模組會輸出一個函數， 並且在Node.js下完成， 相容JavaScript。 通常情況下用npm管理載入器， 但是也可以在你的應用裡以檔形式實現載入器。
按照慣例， 載入器通常被命名為xxx-loader，
載入器的命名約定和優先查找順序被定義在webpack配置API resolveLoader.moduleTemplates裡。
-- End --