vite.config.ts 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. import { URL, fileURLToPath } from 'node:url'
  2. import { defineConfig, loadEnv } from 'vite'
  3. import createVitePlugins from './config/plugins'
  4. export default defineConfig(({ command, mode }) => {
  5. const env = loadEnv(mode, process.cwd()) as ImportMetaEnv
  6. return {
  7. // 开发或生产环境服务的公共基础路径
  8. base: env.VITE_BASE,
  9. // 路径别名
  10. resolve: {
  11. alias: {
  12. '~': fileURLToPath(new URL('./', import.meta.url)),
  13. '@': fileURLToPath(new URL('./src', import.meta.url)),
  14. },
  15. },
  16. // 引入sass全局样式变量
  17. css: {
  18. preprocessorOptions: {
  19. scss: {
  20. additionalData: `@import "@/styles/var.scss";`,
  21. api: 'modern-compiler',
  22. },
  23. },
  24. },
  25. // 添加需要vite优化的依赖
  26. optimizeDeps: {
  27. include: ['vue-draggable-plus'],
  28. },
  29. server: {
  30. // 服务启动时是否自动打开浏览器
  31. open: true,
  32. // 本地跨域代理 -> 代理到服务器的接口地址
  33. proxy: {
  34. '/web': {
  35. target: env.VITE_API_BASE_URL, // 后台服务器地址
  36. changeOrigin: true, // 是否允许不同源
  37. secure: false, // 支持https
  38. rewrite: (path) => path.replace(/^\/web/, ''),
  39. },
  40. },
  41. },
  42. plugins: createVitePlugins(env, command === 'build'),
  43. // 构建
  44. build: {
  45. chunkSizeWarningLimit: 2000, // 消除打包大小超过500kb警告
  46. outDir: 'dist', // 指定打包路径,默认为项目根目录下的dist目录
  47. minify: 'terser', // Vite 2.6.x 以上需要配置 minify:"terser",terserOptions才能生效
  48. terserOptions: {
  49. compress: {
  50. keep_infinity: true, // 防止 Infinity 被压缩成 1/0,这可能会导致 Chrome 上的性能问题
  51. drop_console: true, // 生产环境去除 console
  52. drop_debugger: true, // 生产环境去除 debugger
  53. },
  54. format: {
  55. comments: false, // 删除注释
  56. },
  57. },
  58. // 静态资源打包到dist下的不同目录
  59. rollupOptions: {
  60. output: {
  61. chunkFileNames: 'static/js/[name]-[hash].js',
  62. entryFileNames: 'static/js/[name]-[hash].js',
  63. assetFileNames: 'static/[ext]/[name]-[hash].[ext]',
  64. },
  65. },
  66. },
  67. // 以 envPrefix 开头的环境变量会通过 import.meta.env 暴露在你的客户端源码中。
  68. envPrefix: ['VITE', 'FILE'],
  69. }
  70. })