Use Vite/Vue Plugin

Valaxy 兼容 Vite/Vue 插件,你可以参考以下示例进行使用。

使用 Vite 插件

使用 vite-plugin-pwa

vite.config.ts 中添加以下配置:

import { defineValaxyConfig } from 'valaxy'
import type { ThemeConfig } from 'valaxy-theme-yun'
import { VitePWA } from 'vite-plugin-pwa'

export default defineValaxyConfig<ThemeConfig>({
  vite: {
    plugins: [
      VitePWA(),
      Inspect(),
    ],
  },
})
// setup/main.ts
import { defineAppSetup } from 'valaxy'

export default defineAppSetup(({ router, isClient }) => {
  router.isReady().then(async () => {
    if (!isClient)
      return
    const { registerSW } = await import('virtual:pwa-register')
    registerSW({ immediate: true })
  })
})

更多配置请参考 vite-plugin-pwa

使用 Vue 插件

如使用 Element Plus,你可以在 setup/main.ts 中添加以下配置:

import { defineAppSetup } from 'valaxy'

import ElementPlus from 'element-plus'
import 'element-plus/lib/theme-chalk/index.css'

export default defineAppSetup(({ app }) => {
  app.use(ElementPlus)
})