（new）DllPlugin+DllReferencePlugi

DllPlugin和DllReferencePlugin提供分离包的方式可以大大提高构建时间性能。主要思想在于，将一些不做修改的依赖文件，提前打包，这样我们开发代码发布的时候就不需要再对这部分代码进行打包。从而节省了打包时间。

一、没分离打包之前，打包结果及速度如下：

没有分开打包第三方（耗时：4.7s） 没有分开：第三方打包进app.[hash:8].js

二、开始分离：

1. 创建文件 webpack.config.dll.js ，进行相关配置：

const path = require('path');
const webpack = require('webpack');

module.exports = {
    entry: {
        vendor: [ // 提前打包一些基本不怎么修改的文件
            'react',
            'react-dom',
            'antd'
        ]
    },
    output: {
        filename: 'public/dll/[name].dll.js',
        path: path.resolve(__dirname, '../dist'),
        library: '_dll_vendor' // 暴露出的全局变量名
        // 打包出来的manifest.json和dll.js的n//可选 暴露出的全局变量名
        // vendor.dll.js中暴露出的全局变量名，主要是给DllPlugin中的name使用，
        // 故这里需要和webpack.DllPlugin中的`name: '_dll_vendor',`保持一致。
    },
    plugins: [
        new webpack.DllPlugin({
            path: path.join(__dirname, '../dist/public/dll/vendor-manifest.json'),
            name: '_dll_vendor' // 公开的dll函数的名称，和output. library保持一致即可
        })
    ]
};

2. 运行package.json里添加的脚本：npm run build:dll，单独打包第三方结果如下：
   package.json："build:dll": "webpack --config webpack/webpack.config.dll.js"
   单独打包第三方（耗时：2.8s）
3. 上面已经将第三方打包出来了，那么pro配置文件就不需要打包第三方依赖了，如下配置：

plugins: [
        // 每一次打包都会删除dist文件夹，但是现在需要保留dll文件夹，不需要重复打包
        new CleanWebpackPlugin(['public', 'index.html'], {
            root: path.resolve(__dirname, '../dist'),
            exclude: ['dll'] // clean时，不删除dll文件夹
        }),

        // webpack读取到vendor的manifest文件对于vendor的依赖不会进行编译打包
        new webpack.DllReferencePlugin({
            manifest: require(path.resolve(__dirname, '../dist/public/dll/vendor-manifest.json'))
        }),

        // 将第三方打包文件vendor.dll.js动态添加进html里
        new HtmlWebpackIncludeAssetsPlugin({
            assets: ['public/dll/vendor.dll.js'],
            append: false // false 在其他资源的之前添加 true 在其他资源之后添加
        })
]

注意（1）：由于版本不一样，导致传参不一样；将clean-webpack-plugin版本将到v1.0.1，因为最新版本只支持一个对象传参，不支持现在的需求（删除时不删除dll文件，需要低版本支持两个传参方式）。
注意（2）：选用插件的对比

4. 直接运行npm run build即可，结果如下：
   分开打包，不删除dll文件（耗时：3.8）

分开后：第三方就有单独的文件夹，并且app.[hash:8].js里不存在第三方库

5. 最后，放一下package.json的scripts配置：

   
   

可见，提升速度确实快了，不过后面还需继续不断提升打包速度。