webpack之利用緩存提升二次構建速度

1.babel-loader開啓緩存

官方文檔中的說明：https://webpack.docschina.org...
cacheDirectory：默認值爲 false。當有設置時，指定的目錄將用來緩存 loader 的執行結果。以後的 webpack 構建，將會嘗試讀取緩存，來避免在每次執行時，可能產生的、高性能消耗的 Babel 從新編譯過程(recompilation process)。若是設置了一個空值 (loader: 'babel-loader?cacheDirectory') 或者 true (loader: 'babel-loader?cacheDirectory=true')，loader 將使用默認的緩存目錄 node_modules/.cache/babel-loader，若是在任何根目錄下都沒有找到 node_modules 目錄，將會降級回退到操做系統默認的臨時文件目錄。
開啓緩存以後，能夠在node_modules下看到有一個.cache文件

發現官網說的方式並不生效，須要修改爲寫在option裏面才生效

2.terser-webpack-plugin開啓緩存

其中parallel是 使用多進程並行運行可提升構建速度，明顯提高構建速度
cache 啓用文件緩存。緩存目錄的默認路徑：node_modules/.cache/terser-webpack-plugin。
此配置 在使用 UglifyJSWebpackPlugin時同理。

3.hard-source-webpack-plugin

用於爲模塊提供中間緩存步驟 存在node_modules/.cache/hard-source下,能明顯提高構建的速度！！