PowerAnalysis_blue/vue.config.js

const path = require('path');
const resolve = (dir) => path.join(__dirname, dir);
const CopyWebpackPlugin = require('copy-webpack-plugin');
const webpack = require('webpack');

function extendDefaultPlugins(arr) {
  let plug = [
    'removeDoctype',
    'removeXMLProcInst',
    'removeComments',
    'removeMetadata',
    'removeEditorsNSData',
    'cleanupAttrs',
    'mergeStyles',
    'inlineStyles',
    'minifyStyles',
    'cleanupIDs',
    'removeUselessDefs',
    'cleanupNumericValues',
    'convertColors',
    'removeUnknownsAndDefaults',
    'removeNonInheritableGroupAttrs',
    'removeUselessStrokeAndFill',
    'removeViewBox',
    'cleanupEnableBackground',
    'removeHiddenElems',
    'removeEmptyText',
    'convertShapeToPath',
    'convertEllipseToCircle',
    'moveElemsAttrsToGroup',
    'moveGroupAttrsToElems',
    'collapseGroups',
    'convertPathData',
    'convertTransform',
    'removeEmptyAttrs',
    'removeEmptyContainers',
    'mergePaths',
    'removeUnusedNS',
    'sortDefsChildren',
    'removeTitle',
    'removeDesc'
  ];
  return plug.concat(arr);
}

// 添加less继承
function addStyleResource(rule) {
  rule.use('style-resource')
    .loader('style-resources-loader')
    .options({
      patterns: [
        resolve('src/assets/styles/common/common.less')
      ]
    })
}


module.exports = {

  publicPath: "./", // 默认'/'，部署应用包时的基本 URL
  indexPath: 'index.html', // 相对于打包路径index.html的路径
  outputDir: 'dist', // 'dist', 生产环境构建文件的目录
  assetsDir: 'static', // 相对于outputDir的静态资源(js、css、img、fonts)目录
  lintOnSave: false, // 是否在开发环境下通过 eslint-loader 在每次保存时 li
  runtimeCompiler: true, // 是否使用包含运行时编译器的 Vue 构建版本
  pluginOptions: {
    windicss: {
      // see https://github.com/windicss/vite-plugin-windicss/blob/main/packages/plugin-utils/src/options.ts
    },
  },
  configureWebpack: {
    plugins: [
    ],
    module:{
      rules: [
        {
          test: /\.js$/,
          use: {
            loader: '@open-wc/webpack-import-meta-loader',
          },
        },
      ]
    }
  },

  chainWebpack: (config) => {
    config.resolve.symlinks(true); // 修复热更新失效
    config.plugin('html')
      .tap(args => {
        args[0].title = "新能源区域集控运行管理系统";
        return args;
      })
    // 路径别名
    config.resolve.alias
      .set("@", resolve("src"))
      .set("@node", resolve("node_modules"))
      .set("@com", resolve("src/components"))
      .set("@assets", resolve("src/assets"))
      .set("@api", resolve("src/api"))
      .set("@store", resolve("src/store"))
      .set("@modeConfig", resolve("public/static/config"))
      .set("@tools", resolve("src/tools"))
      .set("cesium", resolve("node_modules/cesium/Source"));

    // less 继承
    const types = ['vue-modules', 'vue', 'normal-modules', 'normal'];
    types.forEach(type => addStyleResource(config.module.rule('less').oneOf(type)));

    const metaLoaderRule = config.module.rule('meta-loader');
    metaLoaderRule.test(/\.js$/)
      .use('@open-wc/webpack-import-meta-loader')
      .loader('@open-wc/webpack-import-meta-loader');

    // svg 雪碧图
    config.module // 排除其他svg-loader
      .rule('svg')
      .exclude.add(resolve('src/assets/icon/svg'))
      .end()
      .exclude.add(resolve('src/assets/icon/svg_fill'))
      .end();

    // svg雪碧图
    const svgRule = config.module.rule('icons');
    svgRule.test(/\.svg$/)
      .include.add(resolve('src/assets/icon/svg'))
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({
        symbolId: 'svg-[name]'
      });

    // svgo 去除svg中无用元素
    svgRule.use('svgo-loader').loader('svgo-loader').options({
      plugins: extendDefaultPlugins([{
        name: "removeAttrs",
        params: {
          attrs: 'fill',
        }
      }])
    });
  },

  devServer: {
    //代理配置
    proxy: {
      '/cbk': {
        target: 'http://192.168.11.109:18701', // 请求地址

        changeOrigin: true, // 在vue-cli3中，默认changeOrigin的值是true,意味着服务器host设置成target，这与vue-cli2不一致，vue-cli2这个默认值是false
        // changeOrigin的值是true,target是host, request URL是http://baidu.com
        // 如果设置changeOrigin: false，host就是浏览器发送过来的host，也就是localhost:8082。

        pathRewrite: {  // 路径重写，eg:把api接口替换为''
          '^/cbk': ''
        }
      }
    },
    open: false, // 是否打开浏览器
  }
}