init: basic structure

src/modules/README.md

@@ -0,0 +1,11 @@
+## Modules
+
+A custom user module system. Place a `.ts` file with the following template, it will be installed automatically.
+
+```ts
+import { type UserModule } from '~/types'
+
+export const install: UserModule = ({ app, router, isClient }) => {
+  // do something
+}
+```

src/modules/nprogress.ts

@@ -0,0 +1,12 @@
+import NProgress from 'nprogress'
+import { type UserModule } from '~/types'
+
+export const install: UserModule = ({ isClient, router }) => {
+  if (isClient) {
+    router.beforeEach((to, from) => {
+      if (to.path !== from.path)
+        NProgress.start()
+    })
+    router.afterEach(() => { NProgress.done() })
+  }
+}

src/modules/pinia.ts

@@ -0,0 +1,17 @@
+import { createPinia } from 'pinia'
+import { type UserModule } from '~/types'
+
+// Setup Pinia
+// https://pinia.esm.dev/
+export const install: UserModule = ({ isClient, initialState, app }) => {
+  const pinia = createPinia()
+  app.use(pinia)
+  // Refer to
+  // https://github.com/antfu/vite-ssg/blob/main/README.md#state-serialization
+  // for other serialization strategies.
+  if (isClient)
+    pinia.state.value = (initialState.pinia) || {}
+
+  else
+    initialState.pinia = pinia.state.value
+}

src/modules/pwa.ts

@@ -0,0 +1,12 @@
+import { type UserModule } from '~/types'
+
+// https://github.com/antfu/vite-plugin-pwa#automatic-reload-when-new-content-available
+export const install: UserModule = ({ isClient, router }) => {
+  if (!isClient)
+    return
+
+  router.isReady().then(async() => {
+    const { registerSW } = await import('virtual:pwa-register')
+    registerSW({ immediate: true })
+  })
+}