vuecli3中src的文件_vue-cli3 DllPlugin 提取公用库

vue 开发过程中，保存一次就会编译一次，如果能够减少编译的时间，哪怕是一丁点，也能节省不少时间。开发过程中个人编写的源文件才会频繁变动，而一些库文件一般我们不会去改动。如果能把库文件提取出来，就能达到减少打包体积，加快编译速度。本文主要讲述在 vue-cli3 中利用 DllPlugin 来进行预编译。

1、安装相关插件

yarn add webpack-cli@^3.2.3 add-asset-html-webpack-plugin@^3.1.3 clean-webpack-plugin@^1.0.1 --dev

复制代码

2、编写配置文件 webpack.dll.conf.js

在项目根目录下新建 webpack.dll.conf.js，输入以下内容。

const path = require('path')

const webpack = require('webpack')

const CleanWebpackPlugin = require('clean-webpack-plugin')

// "clean-webpack-plugin": "^3.0.0"

// const { CleanWebpackPlugin } = require('clean-webpack-plugin');

// dll文件存放的目录

const dllPath = 'public/vendor'

module.exports = {

entry: {

// 需要提取的库文件

vendor: [&#