vite.config.ts 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. import { fileURLToPath, URL } from 'node:url'
  2. import { viteMockServe } from 'vite-plugin-mock'
  3. import path from 'path'
  4. import { defineConfig } from 'vite'
  5. import vue from '@vitejs/plugin-vue'
  6. import AutoImport from 'unplugin-auto-import/vite'
  7. import Components from 'unplugin-vue-components/vite'
  8. import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
  9. import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
  10. // https://vitejs.dev/config/
  11. export default defineConfig(({command})=>{
  12. return {
  13. base:'/dzbc',
  14. // 在生产环境中,将文件名中的 .js 替换为 .mjs
  15. css:{
  16. preprocessorOptions:{
  17. scss:{
  18. additionalData:'@import "./src/styles/variable.scss";' //引入scss文件
  19. }
  20. }
  21. },
  22. plugins: [
  23. viteMockServe({
  24. // 保证开发阶段可以使用mock,生产环境禁止开启
  25. localEnabled: command === 'serve',
  26. mockPath: './mock' // mock数据所在的目录 ./mock 代表和vite.config.js同级目录即根目录
  27. }),
  28. AutoImport({
  29. resolvers: [ElementPlusResolver()],
  30. }),
  31. Components({
  32. resolvers: [ElementPlusResolver()],
  33. }),
  34. createSvgIconsPlugin({
  35. // 指定需要缓存的图标文件夹
  36. iconDirs: [path.resolve(process.cwd(), 'src/assets/icons')],
  37. // 指定symbolId格式
  38. symbolId: 'icon-[dir]-[name]'
  39. }),
  40. vue(),
  41. ],
  42. resolve: {
  43. alias: {
  44. '@': fileURLToPath(new URL('./src', import.meta.url))
  45. }
  46. }
  47. }
  48. })