main.ts 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. import { createApp } from 'vue'
  2. import App from './App.vue'
  3. import router, { setupRouter } from '@/router'
  4. import i18n from '@/i18n/index'
  5. import { setupStore } from '@/store'
  6. import { setupNaive, setupDirectives, setupCustomComponents } from '@/plugins'
  7. import { AppProvider } from '@/components/AppProvider/index'
  8. import { setHtmlTheme } from '@/utils'
  9. // 引入动画
  10. import 'animate.css/animate.min.css'
  11. // 引入标尺
  12. import 'vue3-sketch-ruler/lib/style.css'
  13. async function appInit() {
  14. const appProvider = createApp(AppProvider)
  15. const app = createApp(App)
  16. // 注册全局常用的 naive-ui 组件
  17. setupNaive(app)
  18. // 注册全局自定义指令
  19. setupDirectives(app)
  20. // 注册全局自定义组件
  21. setupCustomComponents(app)
  22. // 挂载状态管理
  23. setupStore(app)
  24. // 解决路由守卫,Axios中可使用,Dialog,Message 等全局组件
  25. appProvider.mount('#appProvider', true)
  26. // 挂载路由
  27. setupRouter(app)
  28. // 路由准备就绪后挂载APP实例
  29. await router.isReady()
  30. // Store 准备就绪后处理主题色
  31. setHtmlTheme()
  32. // 语言注册
  33. app.use(i18n)
  34. // 挂载到页面
  35. app.mount('#app', true)
  36. // 挂载到 window
  37. window['$vue'] = app
  38. }
  39. void appInit()