vue.config.js 配置

// 去除 console
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
// const path = require('path');  别名配置
// 图形化打包详情
const BundleAnalyzer = require('webpack-bundle-analyzer').BundleAnalyzerPlugin

module.exports = {
    publicPath: process.env.NODE_ENV === 'production'
    ? '/hgs'
    : './',
    // 部署应用包时的基本 URL， 用法和 webpack 本身的 output.publicPath 一致。
    // 这个值也可以被设置为空字符串 ('') 或是相对路径 ('./')
    // 这样所有的资源都会被链接为相对路径，这样打出来的包可以被部署在任意路径。
    
    // 打包输出的的文件夹（默认就是 dist）
    outputDir: 'dist',
    
    // 放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录
    assetsDir: 'static',
    
    // 指定生成的 index.html 的输出路径 (相对于 outputDir)。也可以是一个绝对路径
    indexPath: 'index.html',
    
    // 生产环境是否生成 sourceMap 文件
    productionSourceMap: false,
    
    // 每次保存时 lint (校验) 代码 （boolean | 'warning' | 'default' | 'error'）
    lintOnSave: false,
    // 生产构建时禁用
    // lintOnSave: process.env.NODE_ENV !== 'production',
    
    // webpack-dev-server 相关配置
    devServer: {
        /* 自动打开浏览器 */
        open: false,
        // host: "",
        port: 9527,
        
        /* 跨域处理：使用代理 */
        proxy: {
            // '/api':{ 
            [process.env.VUE_APP_BASE_API]: {
                // 目标 ip 
                target: 'http://192.168.1.185:9300',
                // 允许跨域 
                changeOrigin: true,
                pathRewrite: {
                    // "^/api":"", 
                    ['^' + process.env.VUE_APP_BASE_API]: ''
                }
            }
        }
    }
    
    // webpack配置
    // see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md
    chainWebpack: config => {
        // 删除懒加载模块的 prefetch，降低带宽压力
        config.plugins.delete('prefetch'),
        
        // 压缩图片
        const imagesRule = config.module.rule('images')
        imagesRule.uses.clear()
        imagesRule.use('file-loader')
            .loader('url-loader')
            .options({
                // 最大 10 MB
                limit: 10240,
                fallback: {
                    loader: 'file-loader',
                    options: {
                        // 打包后的图片路径
                        outputPath: 'static/images'
                    }
                }
            })
        // 压缩响应的app.json返回的代码压缩
        config.optimization.minimize(true)
    },
    
    // configureWebpack: (config) => {  
    // config.resolve.alias.set("@": resolve('./src'))
    configureWebpack: {
        resolve: {
            //文件优先解析后缀名顺序
            extensions: [".js", ".vue", ".json"], 
            // 别名配置
            alias: {
                '@': resolve('src')
                // "@": path.resolve(__dirname, "./src"),
            }, 
            // 自动解析确定的扩展。默认值为['.wasm', '.mjs', '.js', '.json'] 
            // 引入模块时可不带扩展： 如import File from '../path/to/file';
            extensions: ['.js','.vue','.json'],
        },
        
        // 防止将(在 public/index.html 通过 cdn 引入的)某些 import 的包(package)
        // 打包到 bundle 中而是在运行时(runtime)再去从外部获取这些扩展依赖
        // 引入的时候还是 import AMap from 'AMap'
        externals: {
            'AMap': 'AMap',
            'AMapUI': 'AMapUI'
        }
        
        // 取消console打印
        // vue3 config.optimization.minimizer[0].options.terserOptions.compress.drop_console = true
        if (process.env.NODE_ENV === 'production') {
            // webpack4.x
            optimization: {
                minimizer: [
                    new UglifyJsPlugin({
                        uglifyOptions: {
                            // 删除注释
                            output:{
                                comments:false
                            },
                            // 删除console debugger 删除警告
                            compress: {
                                warnings: false,
                                drop_console: true,//console
                                drop_debugger: false,
                                pure_funcs: ['console.log']//移除console
                            }
                        }
                    })
                ]
            }
        }
    },
    
    // css
    css: {
        // 是否将组件中的 CSS 提取至一个独立的 CSS 文件中(默认生产环境下是 true，开发环境下是 false)
        extract: true,
        sourceMap: false,
        loaderOptions: {
            // 定义全局 scss 无需引入即可使用
            sass: {
                // 注意：在 sass-loader v8 中，这个选项名是 "prependData"
                // additionalData: `@import "~@/assets/style/public.scss"`
                data: `@import '~@/assets/style/public.scss'`
            }
        }
    },
    
    

}

官方文档：https://cli.vuejs.org/zh/config/#vue-config-js

参考文档：https://webpack.docschina.org/configuration/