vite.config.ts 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149
  1. /*
  2. * @Author: fxs bjnsfxs@163.com
  3. * @Date: 2024-08-20 14:06:49
  4. * @LastEditors: fxs bjnsfxs@163.com
  5. * @LastEditTime: 2024-11-14
  6. * @FilePath: \Game-Backstage-Management-System\vite.config.ts
  7. * @Description:
  8. *
  9. */
  10. import { defineConfig } from 'vite'
  11. import vue from '@vitejs/plugin-vue'
  12. import { fileURLToPath, URL } from 'node:url'
  13. import AutoImport from 'unplugin-auto-import/vite'
  14. import Components from 'unplugin-vue-components/vite'
  15. import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
  16. import Icons from 'unplugin-icons/vite'
  17. import IconsResolver from 'unplugin-icons/resolver'
  18. import { visualizer } from 'rollup-plugin-visualizer'
  19. // 打包
  20. import viteCompression from 'vite-plugin-compression'
  21. import { ViteImageOptimizer } from 'vite-plugin-image-optimizer'
  22. const DEFAULT_OPTIONS = {
  23. test: /\.(jpe?g|png|gif|tiff|webp|svg|avif)$/i,
  24. includePublic: true,
  25. logStats: true,
  26. ansiColors: true,
  27. svg: {
  28. multipass: true,
  29. plugins: [
  30. {
  31. name: 'preset-default',
  32. params: {
  33. overrides: {
  34. cleanupNumericValues: false,
  35. removeViewBox: false // https://github.com/svg/svgo/issues/1128
  36. },
  37. cleanupIDs: {
  38. minify: false,
  39. remove: false
  40. },
  41. convertPathData: false
  42. }
  43. },
  44. 'sortAttrs',
  45. {
  46. name: 'addAttributesToSVGElement',
  47. params: {
  48. attributes: [{ xmlns: 'http://www.w3.org/2000/svg' }]
  49. }
  50. }
  51. ]
  52. },
  53. png: {
  54. // https://sharp.pixelplumbing.com/api-output#png
  55. quality: 100
  56. },
  57. jpeg: {
  58. // https://sharp.pixelplumbing.com/api-output#jpeg
  59. quality: 100
  60. },
  61. jpg: {
  62. // https://sharp.pixelplumbing.com/api-output#jpeg
  63. quality: 100
  64. },
  65. tiff: {
  66. // https://sharp.pixelplumbing.com/api-output#tiff
  67. quality: 100
  68. },
  69. // gif does not support lossless compression
  70. // https://sharp.pixelplumbing.com/api-output#gif
  71. gif: {},
  72. webp: {
  73. // https://sharp.pixelplumbing.com/api-output#webp
  74. lossless: true
  75. },
  76. avif: {
  77. // https://sharp.pixelplumbing.com/api-output#avif
  78. lossless: true
  79. },
  80. cache: false,
  81. cacheLocation: undefined
  82. }
  83. // drop: mode === 'production' || mode === 'openUploadFile' ? ['console', 'debugger'] : []
  84. export default defineConfig(({ mode }) => {
  85. return {
  86. build: {
  87. rollupOptions: {
  88. output: {
  89. // manualChunks: {
  90. // echarts: ['echarts']
  91. // },
  92. manualChunks(id) {
  93. if (id.includes('node_modules')) {
  94. const parts = id.split('node_modules/')[1].split('/')
  95. // 支持 scoped 包和普通包
  96. return parts[0].startsWith('@') ? `${parts[0]}/${parts[1]}` : parts[0]
  97. }
  98. },
  99. chunkFileNames: 'js/[name]-[hash].js', // 引入文件名的名称
  100. entryFileNames: 'js/[name]-[hash].js', // 包的入口文件名称
  101. assetFileNames: '[ext]/[name]-[hash].[ext]' // 资源文件像 字体,图片等
  102. }
  103. }
  104. },
  105. esbuild: {
  106. drop: mode === 'production' || mode === 'test' ? ['console', 'debugger'] : []
  107. },
  108. plugins: [
  109. vue(),
  110. ViteImageOptimizer(DEFAULT_OPTIONS),
  111. viteCompression({
  112. verbose: true, // 默认即可
  113. disable: false, // 开启压缩(不禁用),默认即可
  114. deleteOriginFile: false, // 删除源文件
  115. // threshold: 5120, // 压缩前最小文件大小
  116. // algorithm: 'gzip', // 压缩算法
  117. // ext: '.gz' // 文件类型
  118. algorithm: 'brotliCompress',
  119. ext: '.br',
  120. threshold: 10240 // 10KB 以上才压
  121. }),
  122. visualizer({ open: true }),
  123. AutoImport({
  124. resolvers: [ElementPlusResolver()]
  125. }),
  126. Components({
  127. resolvers: [
  128. ElementPlusResolver(),
  129. IconsResolver({
  130. prefix: 'icon'
  131. })
  132. ]
  133. }),
  134. Icons({
  135. autoInstall: true
  136. })
  137. ],
  138. resolve: {
  139. alias: {
  140. '@': fileURLToPath(new URL('./src', import.meta.url))
  141. }
  142. }
  143. }
  144. })