今天繼續學習Webpack技術。
文章是這篇 入門Webpack，看這篇就夠了
css預處理器相關組件常用的是以下三個，less-loader、sass-loader、stylus-loader。還有一個css的相關組件是PostCSS，可以自動補齊所有瀏覽器前綴。
話說這邊的PostCSS的demo跑不通。上網百度了也沒有結果，算了之后自己深入學習的時候再慢慢研究吧，到時候再過來修改。
Plugins是插件，與loader不同，loaders是在打包構建過程中用來處理源文件的（JSX，Scss，Less..），一次處理一個，插件并不直接操作單個文件，它直接對整個構建過程其作用。
常用插件
HtmlWebpackPlugin：這個插件的作用是依據一個簡單的模板，幫你生成最終的Html5文件，這個文件中自動引用了你打包后的JS文件。每次編譯都在文件名中插入一個不同的哈希值。
Hot Module Replacement：熱更新。Hot Module Replacement（HMR）也是webpack里很有用的一個插件，它允許你在修改組件代碼后，自動刷新實時預覽修改后的效果。
話說，原文在這里說應該已經有了熱更新的效果，但是我這邊依然還是需要專門構建一次才能更新，不知道原因是什么。之后再慢慢研究。
優化插件
OccurenceOrderPlugin：為組件分配ID，通過這個插件webpack可以分析和優先考慮使用最多的模塊，并為它們分配最小的ID
UglifyJsPlugin：壓縮JS代碼；
ExtractTextPlugin：分離CSS和JS文件
OccurenceOrder 和 UglifyJS plugins 都是內置插件，你需要做的只是安裝它們
緩存
緩存無處不在，使用緩存的最好方法是保證你的文件名和文件內容是匹配的（內容改變，名稱相應改變）
webpack可以把一個哈希值添加到打包的文件名中，使用方法如下,添加特殊的字符串混合體（[name], [id] and [hash]）到輸出文件名前
new ExtractTextPlugin("[name]-[hash].css")
文章暫時看完了，在這篇文章的開始其實就已經demo進行不下去了，看來還是沒有看文檔的關系另外看到了評論區寫了很多webpack，webpack2，webpack3。看樣子還是需要先去了解一下啊。
這篇文章的學習先到這邊了。
