IssueSupportManage/vite.config.ts

import { defineConfig } from 'vite';
import { resolve } from 'node:path';
import vue from '@vitejs/plugin-vue';
import vueJsx from '@vitejs/plugin-vue-jsx';
import Components from 'unplugin-vue-components/vite';
import { AntDesignVueResolver } from 'unplugin-vue-components/resolvers';
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons';
import tsconfigPaths from 'vite-tsconfig-paths';
import { terser } from 'rollup-plugin-terser';
import WindiCSS from 'vite-plugin-windicss';
import path from 'path';
import Markdown from 'vite-plugin-md';
import topLevelAwait from 'vite-plugin-top-level-await';

const CWD = process.cwd();

// https://vitejs.dev/config/
export default defineConfig({
  build: {
    minify: false, // 禁用代码压缩
  },
  resolve: {
    alias: {
      '@': path.resolve(__dirname, 'src'),
    },
    extensions: ['.js', '.ts', '.tsx', '.jsx'],
  },
  // optimizeDeps: {
  //   include: ['@vueup/vue-quill'],
  // },
  plugins: [
    vue({
      include: [/\.vue$/, /\.md$/], // <--
    }),
    Markdown(),
    WindiCSS(),
    vueJsx({
      // options are passed on to @vue/babel-plugin-jsx
    }),
    createSvgIconsPlugin({
      // Specify the icon folder to be cached
      iconDirs: [resolve(CWD, 'src/assets/icons')],
      // Specify symbolId format
      symbolId: 'svg-icon-[dir]-[name]',
    }),
    // https://github.com/antfu/unplugin-vue-components
    //让 unplugin-vue-components 只有在生产环境生效
    {
      ...Components({
        resolvers: [AntDesignVueResolver()],
      }),
      apply: 'build',
    },
    // 开发环境动态加入ui库框架引入
    {
      name: 'dev-auto-import-antdv',
      transform(code, id) {
        if (/src\/main.ts$/.test(id)) {
          const result = code.split('\n');
          const script = `
              import * as components from 'ant-design-vue/es/components';
              const filters = ['AButton'];
              Object.entries(components).forEach(([key, comp]) => {
                if (comp.install && !filters.includes(comp.name)) {
                  app.use(comp);
                }
              });
            `;
          // 解决首次加载isCustomElement的问题
          result.splice(result.length - 2, 0, script);
          return {
            code: result.join('\n'),
            map: null,
          };
        }
      },
      apply: 'serve',
    },
    tsconfigPaths(),
    {
      apply: 'build',
      ...terser({
        format: {
          comments: false,
        },
        compress: {
          drop_console: true,
          drop_debugger: true,
        },
      }),
    } as any,
    topLevelAwait({
      // The export name of top-level await promise for each chunk module
      promiseExportName: '__tla',
      // The function to generate import names of top-level await promise in each chunk module
      promiseImportName: (i) => `__tla_${i}`,
    }),
  ],
  css: {
    preprocessorOptions: {
      less: {
        javascriptEnabled: true,
        modifyVars: {},
        additionalData: `
          @import "ant-design-vue/lib/style/themes/default.less";
          @import "@/styles/variables.less";
        `,
      },
      // scss: {
      //   additionalData: `
      //   @use 'sass:math';
      //   @import "src/styles/global.scss";
      //   `,
      // },
    },
  },
  server: {
    host: '0.0.0.0',
    port: 8088,
    // proxy: {
    //   '/api': {
    //     target: 'https://nest-api.buqiyuan.site/api/',
    //     // target: 'http://localhost:7001',
    //     changeOrigin: true,
    //     rewrite: (path) => path.replace(/^\/api/, ''),
    //   },
    //   '/ws-api': {
    //     target: 'wss://nest-api.buqiyuan.site',
    //     // target: 'http://localhost:7002',
    //     changeOrigin: true, //是否允许跨域
    //     ws: true,
    //   },
    // },
  },
});