vite.config.ts 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. import { defineConfig, loadEnv } from 'vite';
  2. import path from 'path';
  3. import vue from '@vitejs/plugin-vue';
  4. import { viteVConsole } from 'vite-plugin-vconsole';
  5. export default defineConfig(({ mode, command }) => {
  6. // 加载环境配置
  7. const env = loadEnv(mode, path.join(process.cwd(), 'env'));
  8. return {
  9. base: '/',// 基础路径
  10. envDir: './env',// 环境目录
  11. css: {
  12. preprocessorOptions: {
  13. scss: {// 全局导入
  14. charset: false,
  15. additionalData: '@import "./src/styles/variables";',
  16. },
  17. }
  18. },
  19. resolve: {
  20. // 别名
  21. alias: [
  22. {
  23. find: '/@',
  24. replacement: path.resolve(__dirname, './src'),
  25. }
  26. ],
  27. },
  28. server: {
  29. // 监听所有地址
  30. host: '0.0.0.0',
  31. // 自定义端口号
  32. port: 3010,
  33. // 自动打开浏览器
  34. open: true,
  35. // 开启热更新
  36. hmr: true,
  37. // 若端口被占用,自动尝试下一个可用端口
  38. strictPort: false,
  39. // 代理规则
  40. proxy: {
  41. '/api': {
  42. // 开启跨域
  43. changeOrigin: true,
  44. // 转发地址
  45. target: env.VITE_API_URL,
  46. // 路径重写
  47. rewrite: (path) => path.replace(/^\/api/, ''),
  48. }
  49. }
  50. },
  51. build: {
  52. chunkSizeWarningLimit: 10240,// 触发警告的chunk大小10M
  53. // 底层配置
  54. rollupOptions: {
  55. output: {
  56. entryFileNames: 'js/[name]-[hash].js',
  57. chunkFileNames: 'js/[name]-[hash].js',
  58. }
  59. },
  60. },
  61. esbuild: {
  62. drop: command === 'build' ? ['console', 'debugger'] : [],
  63. },
  64. plugins: [
  65. vue(),
  66. viteVConsole({
  67. entry: path.resolve(__dirname, './src/main.ts'),// 入口文件
  68. localEnabled: command === 'serve',// serve开发环境下
  69. enabled: command === 'serve',// 本地运行时开启
  70. config: {// 配置
  71. maxLogNumber: 1000,
  72. theme: 'light'
  73. }
  74. }),
  75. ],
  76. }
  77. })