減小文件搜索范圍

配置 resolve.modules

Webpack的resolve.modules配置模塊庫（即 node_modules）所在的位置，在 js 里出現 import 'vue' 這樣不是相對、也不是絕對路徑的寫法時，會去 node_modules 目錄下找。但是默認的配置，會采用向上遞歸搜索的方式去尋找，但通常項目目錄里只有一個node_modules，且是在項目根目錄，為了減少搜索范圍，可以直接寫明 node_modules 的全路徑；同樣，對于別名(`alias)的配置，亦當如此：

function resolve (dir) { return path.join(__dirname, '..', dir)}module.exports = { resolve: { extensions: ['.js', '.vue', '.json'], modules: [  resolve('src'),  resolve('node_modules') ], alias: {  'vue$': 'vue/dist/vue.common.js',  'src': resolve('src'),  'assets': resolve('src/assets'),  'components': resolve('src/components'),  // ...  'store': resolve('src/store') } }, ...}

合理設置 test & include & exclude

test：必須滿足的條件（正則表達式，不要加引號，匹配要處理的文件）

exclude：不能滿足的條件（排除不處理的目錄）

include：導入的文件將由加載程序轉換的路徑或文件數組（把要處理的目錄包括進來）

這可以減少不必要的遍歷，從而減少性能損失。

替換代碼壓縮工具

Webpack 默認提供的 UglifyJS 插件，由于采用單線程壓縮，速度慢 ；

webpack-parallel-uglify-plugin 插件可以并行運行 UglifyJS 插件，更加充分而合理的使用 CPU 資源，這可以大大減少的構建時間；

當然，該插件應用于生產環境而非開發環境，安裝插件后，進行如下配置：

// 刪掉webpack提供的UglifyJS插件// new webpack.optimize.UglifyJsPlugin({// compress: {//  warnings: false,//  drop_console: true// },// sourceMap: true// }),// 增加 webpack-parallel-uglify-plugin來替換const ParallelUglifyPlugin = require('webpack-parallel-uglify-plugin');new ParallelUglifyPlugin({ cacheDir: '.cache/', // 設置緩存路徑，不改動的調用緩存，第二次及后面build時提速 uglifyJS:{ output: {  comments: false }, compress: {  warnings: false } }})

也試了一下同類型插件 webpack-uglify-parallel，但并沒有webpack-parallel-uglify-plugin效果好（可能因項目而異，在大家項目中可以使用對比）。

webpack-parallel-uglify-plugin 插件相對 UglifyJsPlugin 打出的包略大（但是不明顯）；這里的提速和增加的體積相比，我選擇了追求速度（使用后我從40秒降到了19秒）。

拷貝靜態文件

使用copy-webpack-plugin插件：把指定文件夾下的文件復制到指定的目錄；其配置如下：

var CopyWebpackPlugin = require('copy-webpack-plugin')plugins: [ ... // copy custom static assets new CopyWebpackPlugin([ {  from: path.resolve(__dirname, '../static'),  to: config.build.assetsSubDirectory,  ignore: ['.*'] } ])]DllPlugin & DllReferencePlugin