vite.config.ts 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. import vue from "@vitejs/plugin-vue";
  2. import {UserConfig, ConfigEnv, loadEnv, defineConfig} from "vite";
  3. import AutoImport from "unplugin-auto-import/vite";
  4. import Components from "unplugin-vue-components/vite";
  5. import {ElementPlusResolver} from "unplugin-vue-components/resolvers";
  6. import Icons from "unplugin-icons/vite";
  7. import IconsResolver from "unplugin-icons/resolver";
  8. import {createSvgIconsPlugin} from "vite-plugin-svg-icons";
  9. import UnoCSS from "unocss/vite";
  10. import path from "path";
  11. const pathSrc = path.resolve(__dirname, "src");
  12. export default defineConfig(({mode}: ConfigEnv): UserConfig => {
  13. const env = loadEnv(mode, process.cwd());
  14. return {
  15. resolve: {
  16. alias: {
  17. "@": pathSrc,
  18. },
  19. },
  20. css: {
  21. // CSS 预处理器
  22. preprocessorOptions: {
  23. //define global scss variable
  24. scss: {
  25. javascriptEnabled: true,
  26. additionalData: `
  27. @use "@/styles/variables.scss" as *;
  28. `,
  29. },
  30. },
  31. },
  32. server: {
  33. host: "0.0.0.0",
  34. port: Number(env.VITE_APP_PORT),
  35. open: true, // 运行是否自动打开浏览器
  36. proxy: {
  37. // 反向代理解决跨域
  38. [env.VITE_APP_BASE_API]: {
  39. target: "http://devapi.shuimuai.com/", // 线上接口地址
  40. // target: 'http://localhost:8989', // 本地接口地址 , 后端工程仓库地址:https://gitee.com/youlaiorg/youlai-boot
  41. changeOrigin: true,
  42. rewrite: (path) => path.replace(new RegExp("^" + env.VITE_APP_BASE_API), ""), // 替换 /dev-api 为 target 接口地址
  43. },
  44. },
  45. },
  46. plugins: [
  47. vue(),
  48. UnoCSS({}),
  49. AutoImport({
  50. // 自动导入 Vue 相关函数,如:ref, reactive, toRef 等
  51. imports: ["vue", "@vueuse/core"],
  52. eslintrc: {
  53. enabled: false,
  54. filepath: "./.eslintrc-auto-import.json",
  55. globalsPropValue: true,
  56. },
  57. resolvers: [
  58. // 自动导入 Element Plus 相关函数,如:ElMessage, ElMessageBox... (带样式)
  59. ElementPlusResolver(),
  60. IconsResolver({}),
  61. ],
  62. vueTemplate: true,
  63. // 配置文件生成位置(false:关闭自动生成)
  64. dts: false,
  65. // dts: "src/types/auto-imports.d.ts",
  66. }),
  67. Components({
  68. resolvers: [
  69. // 自动导入 Element Plus 组件
  70. ElementPlusResolver(),
  71. // 自动导入图标组件
  72. IconsResolver({
  73. // @iconify-json/ep 是 Element Plus 的图标库
  74. enabledCollections: ["ep"],
  75. }),
  76. ],
  77. // 指定自定义组件位置(默认:src/components)
  78. dirs: ["src/**/components"],
  79. // 配置文件位置(false:关闭自动生成)
  80. dts: false,
  81. // dts: "src/types/components.d.ts",
  82. }),
  83. Icons({
  84. // 自动安装图标库
  85. autoInstall: true,
  86. }),
  87. createSvgIconsPlugin({
  88. // 指定需要缓存的图标文件夹
  89. iconDirs: [path.resolve(pathSrc, "assets/icons")],
  90. // 指定symbolId格式
  91. symbolId: "icon-[dir]-[name]",
  92. }),
  93. ],
  94. // 预加载项目必需的组件
  95. optimizeDeps: {
  96. include: [
  97. "vue",
  98. "vue-router",
  99. "pinia",
  100. "axios",
  101. "element-plus/es/components/form/style/css",
  102. "element-plus/es/components/form-item/style/css",
  103. "element-plus/es/components/button/style/css",
  104. "element-plus/es/components/input/style/css",
  105. "element-plus/es/components/input-number/style/css",
  106. "element-plus/es/components/switch/style/css",
  107. "element-plus/es/components/upload/style/css",
  108. "element-plus/es/components/menu/style/css",
  109. "element-plus/es/components/col/style/css",
  110. "element-plus/es/components/icon/style/css",
  111. "element-plus/es/components/row/style/css",
  112. "element-plus/es/components/tag/style/css",
  113. "element-plus/es/components/dialog/style/css",
  114. "element-plus/es/components/loading/style/css",
  115. "element-plus/es/components/radio/style/css",
  116. "element-plus/es/components/radio-group/style/css",
  117. "element-plus/es/components/popover/style/css",
  118. "element-plus/es/components/scrollbar/style/css",
  119. "element-plus/es/components/tooltip/style/css",
  120. "element-plus/es/components/dropdown/style/css",
  121. "element-plus/es/components/dropdown-menu/style/css",
  122. "element-plus/es/components/dropdown-item/style/css",
  123. "element-plus/es/components/sub-menu/style/css",
  124. "element-plus/es/components/menu-item/style/css",
  125. "element-plus/es/components/divider/style/css",
  126. "element-plus/es/components/card/style/css",
  127. "element-plus/es/components/link/style/css",
  128. "element-plus/es/components/breadcrumb/style/css",
  129. "element-plus/es/components/breadcrumb-item/style/css",
  130. "element-plus/es/components/table/style/css",
  131. "element-plus/es/components/tree-select/style/css",
  132. "element-plus/es/components/table-column/style/css",
  133. "element-plus/es/components/select/style/css",
  134. "element-plus/es/components/option/style/css",
  135. "element-plus/es/components/pagination/style/css",
  136. "element-plus/es/components/tree/style/css",
  137. "element-plus/es/components/alert/style/css",
  138. "@vueuse/core",
  139. "path-to-regexp",
  140. "echarts",
  141. "@wangeditor/editor",
  142. "@wangeditor/editor-for-vue",
  143. "vue-i18n",
  144. "codemirror",
  145. ],
  146. },
  147. };
  148. });