water-ldht/vue.config.js

/**
 * @description vue.config.js全局配置
 */
const path = require('path');
const {
  /* baseURL,*/
  publicPath,
  assetsDir,
  outputDir,
  lintOnSave,
  transpileDependencies,
  title,
  abbreviation,
  devPort,
  providePlugin,
  build7z,
  donation,
} = require('./src/config');
const {
  webpackBarName,
  webpackBanner,
  donationConsole,
} = require('vab-config');
if (donation) donationConsole();
const { version, author } = require('./package.json');
const Webpack = require('webpack');
const WebpackBar = require('webpackbar');
const FileManagerPlugin = require('filemanager-webpack-plugin');
const dayjs = require('dayjs');
const dateTime = dayjs().format('YYYY-M-D HH:mm:ss');
process.env.VUE_APP_TITLE = title;
process.env.VUE_APP_AUTHOR = author;
process.env.VUE_APP_UPDATE_TIME = dateTime;
process.env.VUE_APP_VERSION = version;
const resolve = dir => {
  return path.join(__dirname, dir);
};

module.exports = {
  publicPath,
  assetsDir,
  outputDir,
  lintOnSave,
  transpileDependencies,
  devServer: {
    hot: true,
    port: devPort,
    open: false,
    noInfo: false,
    overlay: {
      warnings: true,
      errors: true,
    },
    proxy: {
      mapqqApi: {
        target: 'https://apis.map.qq.com',

        changeOrigin: true, // 使 Origin 请求头中的主机名变为目标 URL 的主机名
        secure: false, // 不验证 SSL 证书
        logLevel: 'warn', // 代理的日志级别
        pathRewrite: {
          '^/mapqqApi': '',
        },
      },
      api: {
        target: 'http://101.133.141.167:8081',
        changeOrigin: true, // 使 Origin 请求头中的主机名变为目标 URL 的主机名
        secure: false, // 不验证 SSL 证书
        logLevel: 'warn', // 代理的日志级别
        pathRewrite: {
          '^/api': '',
        },
      },
    },

    // after: require('./mock'),
  },
  configureWebpack() {
    return {
      resolve: {
        alias: {
          '@': resolve('src'),
          '*': resolve(''),
        },
      },
      plugins: [
        new Webpack.ProvidePlugin(providePlugin),
        new WebpackBar({
          name: webpackBarName,
        }),
      ],
    };
  },
  chainWebpack(config) {
    config.resolve.symlinks(true);
    config.module
      .rule('svg')
      .exclude.add(resolve('src/icon/remixIcon'))
      .add(resolve('src/icon/colorfulIcon'));
    config.module
      .rule('remixIcon')
      .test(/\.svg$/)
      .include.add(resolve('src/icon/remixIcon'))
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({ symbolId: 'remix-icon-[name]' });
    config.when(process.env.NODE_ENV === 'development', config => {
      config.devtool('source-map');
    });
    config.when(process.env.NODE_ENV === 'production', config => {
      config.performance.set('hints', false);
      config.devtool('none');
      config.optimization.splitChunks({
        chunks: 'all',
        cacheGroups: {
          libs: {
            name: 'vue-admin-beautiful-element-plus-libs',
            test: /[\\/]node_modules[\\/]/,
            priority: 10,
            chunks: 'initial',
          },
          elementUI: {
            name: 'vue-admin-beautiful-element-plus-element-ui',
            priority: 20,
            test: /[\\/]node_modules[\\/]_?element-ui(.*)/,
          },
        },
      });
      config
        .plugin('banner')
        .use(Webpack.BannerPlugin, [`${webpackBanner}${dateTime}`]);
      if (build7z)
        config.plugin('fileManager').use(FileManagerPlugin, [
          {
            onEnd: {
              archive: [
                {
                  source: `./${outputDir}`,
                  destination: `./${outputDir}/${abbreviation}_${dateTime}.7z`,
                },
              ],
            },
          },
        ]);
    });
  },
  runtimeCompiler: true,
  productionSourceMap: false,
  css: {
    // requireModuleExtension: true,
    loaderOptions: {
      css: {
        modules: {
          auto: () => true,
        },
      },
    },

    sourceMap: true,
    loaderOptions: {
      scss: {
        additionalData(content, loaderContext) {
          const { resourcePath, rootContext } = loaderContext;
          const relativePath = path.relative(rootContext, resourcePath);
          if (
            relativePath.replace(/\\/g, '/') !==
            'src/vab/styles/variables/variables.scss'
          )
            return (
              '@use "sass:math";@import "~@/vab/styles/variables/variables.scss";' +
              content
            );
          return content;
        },
      },
    },
  },
};