Configure uglifyjs-webpack-plugin compression code in vue.config.js

If the vue project is packaged and there is only one app.js in the js folder, all the js code will be loaded on the home page. If you need to sub-package, you can execute the following code, so that each page will only load the corresponding js file, reducing the burden on the home page

1. Install the code compression plugin

	npm install uglifyjs-webpack-plugin --save-dev

2. Configure in vue.config.js

configureWebpack: (config) => {
    
    
    //  引入uglifyjs-webpack-plugin
    let UglifyPlugin = require('uglifyjs-webpack-plugin');
    if (process.env.NODE_ENV == 'production') {
    
    
      // 为生产环境修改配置
      config.mode = 'production'
      // 将每个依赖包打包成单独的js文件
      let optimization = {
    
    
        minimizer: [new UglifyPlugin({
    
    
            uglifyOptions: {
    
    
                warnings: false,
                compress: {
    
    
                  drop_console: true, 
                  drop_debugger: false,
                  pure_funcs: ['console.log'] 
                }
            }
         })]
      }
      Object.assign(config, {
    
    
        optimization
      })
    } else {
    
    
      // 为开发环境修改配置
      config.mode = 'development'
   }
  }