union-question-web/vue.config.js

const path = require("path");
const resolve = (dir) => path.join(__dirname, dir);
const proxy = {
  "/api/uq_basic": {
    target: process.env.VUE_APP_QUESTIONS_HOST_URL,
    changeOrigin: true,
  },
  "/api/open": {
    target: process.env.VUE_APP_QUESTIONS_HOST_URL,
    changeOrigin: true,
  },
};

var webpack = require("webpack");
var packageData = require("./package.json");
var v = packageData.version;
const timestamp = Date.now();

let config = {
  // 这里设置项目的路径，比如 '/admin' 。设置以后 BASE_URL就有值了。
  // 注意这解决不了CDN的问题，CDN的问题要另行研究。
  // 可能的方案是另设一个替代 BASE_URL 的环境变量解决 <%%= BASE_URL %%>favicon.ico 和 ${process.env.BASE_URL}service-worker.js
  publicPath: "/admin",
  lintOnSave: process.env.NODE_ENV !== "production" ? true : "error",
  devServer: {
    proxy,
    // https://webpack.js.org/configuration/dev-server/#overlay
    client: {
      overlay: false,
    },
  },
  configureWebpack: {
    // devtool: "source-map",  // for vscode debug
    plugins: [
      // Ignore all locale files of moment.js
      new webpack.IgnorePlugin({
        resourceRegExp: /^\.\/locale$/,
        contextRegExp: /moment$/,
      }),
      // new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
    ],
  },
  transpileDependencies: [/\bvue-awesome\b/],
  productionSourceMap: false,
  chainWebpack(config) {
    config.module.rule("svg").exclude.add(resolve("./src/assets/icons")).end();
    config.module
      .rule("icons")
      .test(/\.svg$/)
      .include.add(resolve("./src/assets/icons"))
      .end()
      .use("svg-sprite-loader")
      .loader("svg-sprite-loader")
      .options({
        symbolId: "icon-[name]",
      })
      .end();
  },
  css: {
    loaderOptions: {
      scss: {
        additionalData: `@import "@/assets/styles/variables.scss";`, // 不同版本的 sass，此属性不同：data、prependData、additionalData
        sassOptions: { outputStyle: "expanded" }, // fix: 解决 element-ui 图标 icon 偶现乱码问题
      },
    },
  },
};

if (process.env.NODE_ENV === "production") {
  config.css = Object.assign(config.css || {}, {
    extract: {
      filename: `css/[name].${v}.${timestamp}.css`,
      chunkFilename: `css/[name].${v}.${timestamp}.css`,
    },
  });
  config.configureWebpack = Object.assign(config.configureWebpack || {}, {
    output: {
      filename: `js/[name].${v}.${timestamp}.js`,
      chunkFilename: `js/[name].${v}.${timestamp}.js`,
    },
  });
}

module.exports = config;
require("events").EventEmitter.defaultMaxListeners = 0;