menduner/vite.config.mjs

// Plugins
import Components from 'unplugin-vue-components/vite'
import Vue from '@vitejs/plugin-vue'
import Vuetify, { transformAssetUrls } from 'vite-plugin-vuetify'
// import ViteFonts from 'unplugin-fonts/vite'
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
import AutoImport from 'unplugin-auto-import/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import { terser } from 'rollup-plugin-terser'
import path from 'path'
import compression from 'vite-plugin-compression'
// Utilities
import { defineConfig } from 'vite'
import { fileURLToPath, URL } from 'node:url'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    Vue({
      template: { transformAssetUrls }
    }),
    // https://github.com/vuetifyjs/vuetify-loader/tree/master/packages/vite-plugin#readme
    Vuetify(),
    Components({
      dts: true,
      resolvers: [
        (name) => {
          if (name.startsWith('Base')) {
            return { importName: name.slice(4), path: `@/components/CtVuetify/${name}.vue` }
          }
        },
        ElementPlusResolver(),
      ]
    }),
    compression({  
      verbose: true,  
      disable: false,  
      threshold: 10240, // 只会压缩大于 10kb 的文件  
      algorithm: 'gzip', // 可以选择 gzip 或 brotli  
      ext: '.gz', // 输出后缀  
    }),
    AutoImport({
      resolvers: [ElementPlusResolver()],
    }),
    createSvgIconsPlugin({
      iconDirs: [path.resolve(process.cwd(), 'src/assets/svg')],
      // symbolId: 'icon-[dir]-[name]',
    })
    // ViteFonts({
    //   google: {
    //     // families: [{
    //     //   name: 'Roboto',
    //     //   styles: 'wght@100;300;400;500;700;900',
    //     // }],
    //   },
    // }),
  ],
  define: { 'process.env': {} },
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    },
    extensions: [
      '.js',
      '.json',
      '.jsx',
      '.mjs',
      '.ts',
      '.tsx',
      '.vue',
    ],
  },
  build: {
    sourcemap: false, // 生产环境禁用源映射
    rollupOptions: {
      plugins: [terser({ ecma: 2020 })], // 启用 terser 进行代码压缩
      output: {
        // 设置静态资源引用的基础路径
        assetFileNames: 'assets/[name].[hash].[ext]',
        chunkFileNames: 'chunks/[name].[hash].js',
        entryFileNames: '[name].[hash].js',
      },
      watch: true // 允许浏览器在源码变化时自动刷新
    },
  },
  // 配置静态资源处理
  publicDir: 'public', // 设置静态资源目录
  assetsDir: 'assets', // 设置构建后的静态资源目录
  base: '/', // 设置应用的基本URL
  server: {
    port: 3000
  }
  // configureWebpack: {
  //   output: {
  //     filename: 'js/[name].' + new Date().getTime() + '.js',
  //     chunkFilename: 'js/[name].' + new Date().getTime() + '.js'
  //   }
  // }
})