Vue-cli Dll

vue.config.js

/*
 * @Author: zhang gen yuan
 * @Date: 2021-03-30 09:27:11
 * @Descripttion: 
 */
const webpack = require('webpack')
const path = require('path')
module.exports = {
    //二者选其一
    chainWebpack: config => {
        config.plugin('dll-reference-plugin')
            .use(webpack.DllReferencePlugin)
            .tap(options => {
                options[0] = {
                    context: __dirname,
                    // manifest就是我们第2步中打包出来的json文件
                    manifest: require(path.join(__dirname, `./vendor-manifest.json`))
                }
                return options
            })
    },
    configureWebpack: config => {
        config.plugins.push(new webpack.DllReferencePlugin({
            context: __dirname,
            // manifest就是我们第2步中打包出来的json文件
            manifest: require('./vendor-manifest.json')
        }))
    }
}

dll.js

/*
 * @Author: zhang gen yuan
 * @Date: 2021-03-30 09:25:34
 * @Descripttion: 
 */
const path = require('path')
const webpack = require('webpack')
module.exports = {
  entry: {
  //一些依赖库，也不知道配的对不对，没有标准答案
    vendor: ['vue-router', 'vuex','axios']
  },
  output: {
    path: path.join(__dirname, 'public'),
    filename: '[name].js',
    library: '[name]_[hash]'
  },
  plugins: [
    new webpack.DllPlugin({
      // DllPlugin的name属性需要和libary保持一致
      name: '[name]_[hash]',
      //指定当前目录
      path: path.join(__dirname, '.', '[name]-manifest.json'),
      // context需要和webpack.config.js保持一致
      context: __dirname
    })
  ]
}

"dll": "webpack --config ./dll.js"

<script src="./vendor.js"></script>