Webpack性能優(yōu)化的方式有很多種,本文之所以將 dll 單獨(dú)講解,是因?yàn)?dll 是一種最簡(jiǎn)單粗暴并且極其有效的優(yōu)化方式。

在通常的打包過程中,你所引用的諸如:jquery、bootstrap、react、react-router、redux、antd、vue、vue-router、vuex 等等眾多庫(kù)也會(huì)被打包進(jìn) bundle 文件中。由于這些庫(kù)的內(nèi)容基本不會(huì)發(fā)生改變,每次打包加入它們無(wú)疑是一種巨大的性能浪費(fèi)。

Dll 的技術(shù)就是在第一次時(shí)將所有引入的庫(kù)打包成一個(gè) dll.js 的文件,將自己編寫的內(nèi)容打包為 bundle.js 文件,這樣之后的打包只用處理 bundle 部分。

 

以一個(gè) Vue 項(xiàng)目為例,首先創(chuàng)建一個(gè)名為 webpack.dll.config.js 的文件

大數(shù)據(jù)培訓(xùn),云培訓(xùn),數(shù)據(jù)挖掘培訓(xùn),云計(jì)算培訓(xùn),高端軟件開發(fā)培訓(xùn),項(xiàng)目經(jīng)理培訓(xùn)

var path = require("path"),
  fs = require('fs'),
  webpack = require("w