vue.config.js

/*
 * @Author: DDY
 * @Date: 2021-08-31 10:35:38
 */
const path = require("path");
const resolve = dir => path.join(__dirname, dir);
module.exports = {
    publicPath: '/',  // 部署应用时的基本 URL
    outputDir: 'dist', //build时文件输出的目录
    assetsDir: 'static', //build时生成的相对于outputDir的静态资源的目录（js、css、img、font）
    lintOnSave: true, //是否开启eslint保存检测，有效值：true、false、error
    productionSourceMap: false, //是否在构建生产包时生成sourceMap文件，false将提高构建速度
    filenameHashing: true,
    
    // 本地服务器，所有 webpack-dev-server 的选项都支持
    devServer: {
        historyApiFallback: {
            index: '/index.html' //与output的publicPath
        },
        open: true, // npm run serve后自动打开页面
        host: '0.0.0.0', // 匹配本机IP地址(默认是0.0.0.0)
        port: 8080, //端口号
        https: false,
        hot: true, //热加载
        proxy: {
            "/dev": {
                target: 'http://api-XXXX.com/', 
                changeOrigin: true,
                pathRewrite: {
                    '^/dev': ''
                }
            },
        },
        before: app => {
        }
    },
    chainWebpack: config => {
        /* svg的配置 */
        const svgRule = config.module.rule("svg");
         //webpack5 的配置有点区别  解开注释
         //svgRule.delete('type')
         //svgRule.delete('generator');

        svgRule.uses.clear();
        svgRule.exclude.add(/node_modules/);
        svgRule
            .test(/\.svg$/)
            .use("svg-sprite-loader")
            .loader("svg-sprite-loader")
            .options({
                symbolId: "icon-[name]"
            });
        const imageRule=config.module.rule("images");
        imageRule.exclude.add(resolve("src/icons"));
        imageRule.test(/\.(png|jpe?g|gif|svg)(\?.*)?$/);
        /* 生产环境图片进行压缩 */    
        if (process.env.NODE_ENV=='production') {
            config.module
                .rule('images')
                .use('url-loader')
                .loader('url-loader')
                .tap(options => Object.assign(options, { limit: 10240 }))
        }
        /* 别名的配置 */
        config.resolve.alias
            .set("@", resolve("src"))
            .set("@assets", resolve("src/assets"))
    },
    // 构建时开启多进程处理 babel 编译
    parallel: require('os').cpus().length > 1,

    // https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa
    pwa: {},

    // 第三方插件配置
    pluginOptions: {}
};