vue. config. Implementation of configuring webpack in JS to improve code compilation speed

Refer to relevant documents:

One line of code can make the project start more than 70% faster
https://mp.weixin.qq.com/s/eS…

The following two methods can improve the compilation speed
The speed of starting local projects is generally slow for the first time, and the speed increases a lot after the second time

Install the plug-in in the development environment and only optimize the compilation speed of the development environment
NPM I hard source webpack plugin – D / / increase compilation speed
NPM I speed measure webpack plugin – D / / displays the compilation time

In Vue config. JS
const HardSourceWebpackPlugin = require(‘hard-source-webpack-plugin’);
const SpeedMeasurePlugin = require(‘speed-measure-webpack-plugin’);

1. Chain writing

chainWebpack: (config) => {
    config. plugin('xcCache'). use(HardSourceWebpackPlugin); //  Custom plug-in name
    config.plugin('xcTime').use(SpeedMeasurePlugin);
},

2. Common writing

configureWebpack: {
    plugins: [
        new HardSourceWebpackPlugin(),
        new SpeedMeasurePlugin()
    ]
},