Vuecli3.0 借助DLLPlugin 和 DLLReferencePlugin 用某种方法实现了拆分 bundles，同时还大大提升了构建的速度。

DLLPlugin 和 DLLReferencePlugin Vuecli 3.0

在vue项目，在打包的过程中将，常用的包进行提前打包，节省之后打包的时间。

1.新增库打包文件webpack.dll.conf

const path = require('path');
const webpack = require('webpack');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const package = require('./package.json');

const dllPath = package.dllPath; // 输出打包后的目录

module.exports = {
    entry: {
        // 需要提取的库文件
        vendor: ['vue', 'vue-router', 'vuex', 'axios', 'element-ui', 'html2canvas', 'vconsole', 'vue-axios', 'v-viewer']
    },
    output: {
        path: path.join(__dirname, dllPath),
        filename: 'dfg.[name].dll.[hash:8].js',
        library: '[name]_[hash]'
    },
    plugins: [
        new CleanWebpackPlugin(), // https://www.npmjs.com/package/clean-webpack-plugin
        new webpack.DllPlugin({ // https://webpack.js.org/plugins/dll-plugin/#root
            path: path.join(__dirname, dllPath, '[name]-manifest.json'),
            name: '[name]_[hash]',
            context: process.cwd()
        })
    ]
};

2.修改vue.config.js

// webpack的配置在这个属性里修改configureWebpack
    configureWebpack: config => {
        //config.plugins.push(
        //    new AddAssetHtmlPlugin({
        //        filepath: path.resolve(__dirname, './public/vendor/*.js')
        //    })
        //);
        if (process.env.NODE_ENV === 'development') {
            config.devtool = 'source-map';
            // mutate config for production...
        } else {
            config.plugins.push(
                new webpack.DllReferencePlugin({
                    context: process.cwd(),
                    manifest: require(dllPath + '/vendor-manifest.json')
                })
            );
            /// 将打包出来文件动态引入index.html
            config.plugins.push(
                new AddAssetHtmlPlugin({
                    // dll文件位置
                    filepath: path.resolve(__dirname, dllPath + '/*.js'),
                    // dll 引用路径
                    publicPath: linkPath,
                    // dll最终输出的目录
                    outputPath: linkPath
                })
            );
            if (process.env.Analyse) {
                config.plugins.push(new BundleAnalyzerPlugin()); 
            }
        }
    },

DLLPlugin，DLLReferencePlugin配置参考链接：https://www.webpackjs.com/plugins/dll-plugin/
webpack插件：clean-webpack-plugin-> https://www.npmjs.com/package/clean-webpack-plugin

可以进行拆分打包后的文件可参考：https://www.jianshu.com/p/862c56479456