feat: vite-ssg (#24)

src/logics/dark.ts

@@ -18,6 +18,6 @@ export const isDark = computed({
 
 watch(
   isDark,
-  v => document.documentElement.classList.toggle('dark', v),
+  v => typeof document !== 'undefined' && document.documentElement.classList.toggle('dark', v),
   { immediate: true },
 )

src/main.ts

@@ -1,12 +1,21 @@
 import './main.postcss'
-import { createApp } from 'vue'
+// import routes generated by Voie
+import routes from 'voie-pages'
+// progress bar
+import NProgress from 'nprogress'
+import { ViteSSG } from 'vite-ssg'
 import installPlugins from './plugins'
-
 import App from './App.vue'
 
-const app = createApp(App)
+export const createApp = ViteSSG(
+  App,
+  { routes },
+  ({ app, router, isClient }) => {
+    installPlugins(app)
 
-installPlugins(app)
-
-// true for hydrate
-app.mount('#app', true)
+    if (isClient) {
+      router.beforeEach(() => { NProgress.start() })
+      router.afterEach(() => { NProgress.done() })
+    }
+  }
+)

src/plugins/index.ts

@@ -1,9 +1,7 @@
 import { App } from 'vue'
-import installRouter from './router'
 import installI18n from './i18n'
 import './icons'
 
 export default (app: App) => {
-  installRouter(app)
   installI18n(app)
 }

src/plugins/router.ts

@@ -1,18 +0,0 @@
-import { App } from 'vue'
-import { createRouter, createWebHistory } from 'vue-router'
-// import routes generated by Voie
-import routes from 'voie-pages'
-// progress bar
-import NProgress from 'nprogress'
-
-export default (app: App) => {
-  const router = createRouter({
-    history: createWebHistory(),
-    routes,
-  })
-
-  router.beforeEach(() => { NProgress.start() })
-  router.afterEach(() => { NProgress.done() })
-
-  app.use(router)
-}