fix icon

zhangzengfei

2021-11-19 4da4901f6793eee540ec97b9e6d6694078cefdcd

 vue.config.js

@@ -1,4 +1,4 @@
const path = require('path')
const path = require("path");
const {
  publicPath,
  assetsDir,
@@ -11,27 +11,21 @@
  providePlugin,
  build7z,
  donation,
} = require('./src/config')
const { webpackBarName, webpackBanner, donationConsole } = require('zx-layouts')
} = require("./src/config");

const { version, author } = require('./package.json')
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 date = dayjs().format('YYYY_M_D')
const time = dayjs().format('YYYY-M-D HH:mm:ss')
process.env.VUE_APP_TITLE = title || 'vue-admin-beautiful'
process.env.VUE_APP_AUTHOR = author || 'chuzhixin 1204505056@qq.com'
process.env.VUE_APP_UPDATE_TIME = time
process.env.VUE_APP_VERSION = version
const Webpack = require("webpack");
const WebpackBar = require("webpackbar");
const dayjs = require("dayjs");
const date = dayjs().format("YYYY_M_D");
const time = dayjs().format("YYYY-M-D HH:mm:ss");
process.env.VUE_APP_TITLE = "vue-intergrate";
process.env.VUE_APP_AUTHOR = "basic";
process.env.VUE_APP_UPDATE_TIME = time;
process.env.VUE_APP_VERSION = version;

const resolve = (dir) => path.join(__dirname, dir)
const mockServer = () => {
  if (process.env.NODE_ENV === 'development') return require('./mock')
  else return ''
}
const resolve = (dir) => path.join(__dirname, dir);

module.exports = {
  publicPath,
@@ -49,123 +43,89 @@
      warnings: true,
      errors: true,
    },
    after: mockServer(),
  },
  configureWebpack() {
    return {
      resolve: {
        alias: {
          '@': resolve('src'),
          "@": resolve("src"),
        },
      },
      plugins: [
        new Webpack.ProvidePlugin(providePlugin),
        new WebpackBar({
          name: webpackBarName,
          name: "vue-intergrate",
        }),
      ],
    }
    };
  },
  chainWebpack(config) {
    config.plugins.delete('preload')
    config.plugins.delete('prefetch')
    config.plugins.delete("preload");
    config.plugins.delete("prefetch");
    config.module
      .rule('svg')
      .exclude.add(resolve('src/remixIcon'))
      .add(resolve('src/colorfulIcon'))
      .end()
      .rule("svg")
      .exclude.add(resolve("src/remixIcon"))
      .add(resolve("src/colorfulIcon"))
      .end();

    config.module
      .rule('remixIcon')
      .rule("remixIcon")
      .test(/\.svg$/)
      .include.add(resolve('src/remixIcon'))
      .include.add(resolve("src/remixIcon"))
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({ symbolId: 'remix-icon-[name]' })
      .end()
      .use("svg-sprite-loader")
      .loader("svg-sprite-loader")
      .options({ symbolId: "remix-icon-[name]" })
      .end();

    config.module
      .rule('colorfulIcon')
      .rule("colorfulIcon")
      .test(/\.svg$/)
      .include.add(resolve('src/colorfulIcon'))
      .include.add(resolve("src/colorfulIcon"))
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({ symbolId: 'colorful-icon-[name]' })
      .end()
      .use("svg-sprite-loader")
      .loader("svg-sprite-loader")
      .options({ symbolId: "colorful-icon-[name]" })
      .end();

    /*  config.when(process.env.NODE_ENV === "development", (config) => {
      config.devtool("source-map");
    }); */
    config.when(process.env.NODE_ENV !== 'development', (config) => {
      config.performance.set('hints', false)
      config.devtool('none')
    config.when(process.env.NODE_ENV !== "development", (config) => {
      config.performance.set("hints", false);
      config.devtool("none");
      config.optimization.splitChunks({
        automaticNameDelimiter: '-',
        chunks: 'all',
        automaticNameDelimiter: "-",
        chunks: "all",
        cacheGroups: {
          chunk: {
            name: 'vab-chunk',
            name: "vab-chunk",
            test: /[\\/]node_modules[\\/]/,
            minSize: 131072,
            maxSize: 524288,
            chunks: 'async',
            chunks: "async",
            minChunks: 2,
            priority: 10,
          },
          vue: {
            name: 'vue',
            name: "vue",
            test: /[\\/]node_modules[\\/](vue(.*)|core-js)[\\/]/,
            chunks: 'initial',
            chunks: "initial",
            priority: 20,
          },
          elementUI: {
            name: 'element-ui',
            name: "element-ui",
            test: /[\\/]node_modules[\\/]element-ui(.*)[\\/]/,
            priority: 30,
          },
          extra: {
            name: 'vab-layouts',
            test: resolve('src/layouts'),
            name: "vab-layouts",
            test: resolve("src/layouts"),
            priority: 40,
          },
        },
      })
      config
        .plugin('banner')
        .use(Webpack.BannerPlugin, [`${webpackBanner}${time}`])
        .end()
      config.module
        .rule('images')
        .use('image-webpack-loader')
        .loader('image-webpack-loader')
        .options({
          bypassOnDebug: true,
        })
        .end()
    })

    if (build7z) {
      config.when(process.env.NODE_ENV === 'production', (config) => {
        config
          .plugin('fileManager')
          .use(FileManagerPlugin, [
            {
              onEnd: {
                delete: [`./${outputDir}/video`, `./${outputDir}/data`],
                archive: [
                  {
                    source: `./${outputDir}`,
                    destination: `./${outputDir}/${abbreviation}_${outputDir}_${date}.7z`,
                  },
                ],
              },
            },
          ])
          .end()
      })
    }
      });
    });
  },
  runtimeCompiler: true,
  productionSourceMap: false,
@@ -179,16 +139,16 @@

        /*sass-loader 9.0写法，感谢github用户 shaonialife*/
        additionalData(content, loaderContext) {
          const { resourcePath, rootContext } = loaderContext
          const relativePath = path.relative(rootContext, resourcePath)
          const { resourcePath, rootContext } = loaderContext;
          const relativePath = path.relative(rootContext, resourcePath);
          if (
            relativePath.replace(/\\/g, '/') !== 'src/styles/variables.scss'
            relativePath.replace(/\\/g, "/") !== "src/styles/variables.scss"
          ) {
            return '@import "~@/styles/variables.scss";' + content
            return '@import "~@/styles/variables.scss";' + content;
          }
          return content
          return content;
        },
      },
    },
  },
}
};