vue3 编译很慢_vue-cli3 编译打包文件的压缩优化

前言

相比于vue-cli2，vue-cli3隐藏了很多默认的webpack配置，没有vue-cli2那么一目了然。但是都提供了各部分的修改路口，可以仔细研读下官方文档。

vue-cli3官方文档

真的，如果真的不是业务需要，真的不会去仔细研读官方文档，因为读了也会马上忘掉。但是真的需要的时候，又会第一时刻想起官方文档，看了后才恍然大悟，原来官方文档里都写得一清二楚。内牛满面~~

正文

包含了打包压缩后图片的压缩和js，css文件压缩

首先，安装相关依赖包：

npm install --save-dev image-webpack-loader

npm install --save-dev compression-webpack-plugin

然后，在vue.config.js里进行配置(这里附带了上篇文章中ie11兼容es6的处理方法)：

const CompressionPlugin = require("compression-webpack-plugin")

module.exports = {

publicPath: './',

chainWebpack: config => {

// 解决ie11兼容ES6

config.entry('main').add('babel-polyfill')

// 开启图片压缩

config.module.rule('images')

.test(/\.(png|jpe?g|gif|svg)(\?.*)