vue.config.js配置vue.config.js是一个可选的配置文件，可以对Vue CLI进行个性化的自定义配置

vue.config.js是一个可选的配置文件，可对Vue CLI进行个性化的自定义配置。可以通过修改该文件对Vue CLI的内部webpack配置进行修改和扩展，包括webpack的配置项和插件，可对Vue CLI进行定制。

简单配置:

vue.config.js

const { defineConfig } = require("@vue/cli-service");
const path = require('path');
const webpack = require('webpack');

const resolve = (dir) => path.join(__dirname, dir);

module.exports = defineConfig({
  publicPath: process.env.NODE_ENV === "production" ? "/production" : "/",
  outputDir: "dist",
  assetsDir: "",
  indexPath: "index.hetml",
  filenameHashing: true,
  configureWebpack: (config) => {
    let prefix = config.output.publicPath;
    if (process.env.NODE_ENV === "production") {
      config.plugins = config.plugins.concat([
        new webpack.optimize.SplitChunksPlugin(),
        new webpack.DllReferencePlugin({
          context: __dirname,
          manifest: require("./public/vendor/vendor-manifest.json"),
        }),
        new webpack.DllReferencePlugin({
          context: __dirname,
          manifest: require("./public/vendor/tools-manifest.json"),
        }),
        // 将 dll 注入到 生成的 html 模板中
        new AddAssetHtmlPlugin({
          // dll文件位置
          filepath: path.resolve(__dirname, "./public/vendor/*.js"),
          // dll 引用路径
          publicPath: prefix + "vendor",
          // dll最终输出的目录
          outputPath: "/vendor",
        }),
        new UglifyJsPlugin({
          uglifyOptions: {
            compress: {
              drop_console: true, // 打包时自动删除 console 语句
              drop_debugger: true, // 打包时自动删除 debugger 语句
            },
            warnings: false,
            output: {
              comments: false, // 去掉注释内容
            },
          },
          sourceMap: false, // 该选项应与 productionSourceMap 的设置相同
          parallel: true,
        }),
      ]);
      // 打包文件大小配置
      config.performance = {
        maxEntrypointSize: 10000000,
        maxAssetSize: 30000000,
      };
    }
  },
  chainWebpack: (config) => {
    // 常用的路径转换
    config.resolve.alias
      .set("@$", resolve("src"))
      .set("assets", resolve("src/assets"))
      .set("components", resolve("src/components"))
      .set("pages", resolve("src/views"))
      .set("scripts", resolve("src/scripts"))
      .set("styles", resolve("src/styles"));
  },
  devServer: {
    // host: "localhost",
    // port: "8080",

    proxy: {
      "/api": {
        // 代理地址
        target: "http://xxx.xxx",
        // 跨域处理
        changeOrigin: true,
        // url重写
        pathRewrite: {
          "^/api": "/",
        },
      },
    },
  },
});