diff --git a/index.html b/index.html
index 80821b0..9360132 100644
--- a/index.html
+++ b/index.html
@@ -7,8 +7,6 @@
   <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#00aba9">
   <meta name="msapplication-TileColor" content="#00aba9">
   <meta name="theme-color" content="#ffffff">
-  <meta name="description" content="Opinionated Vite Starter Template">
-  <title>Vitesse</title>
 </head>
 <body>
   <div id="app"></div>
diff --git a/package.json b/package.json
index 0775e2f..b076ab7 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
   "private": true,
   "scripts": {
     "dev": "vite --port 3333 --open",
-    "build": "cross-env NODE_ENV=production vite-ssg build --script async"
+    "build": "cross-env NODE_ENV=production vite-ssg build"
   },
   "dependencies": {
     "@vueuse/core": "^4.0.12",
diff --git a/src/App.vue b/src/App.vue
index 95bd371..1f358ca 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,3 +1,17 @@
+<script setup lang="ts">
+import { useHead } from '@vueuse/head'
+
+// https://github.com/vueuse/head
+// you can use this to manipulate the document head in any components,
+// they will be renedered correctly in the html results with vite-ssg
+useHead({
+  title: 'Vitesse',
+  meta: [
+    { name: 'description', content: 'Opinionated Vite Starter Template' },
+  ],
+})
+</script>
+
 <template>
   <main class="px-4 py-10 text-center text-gray-700 dark:text-gray-200">
     <router-view />
diff --git a/src/components/Footer.vue b/src/components/Footer.vue
index b9cd3ef..95d9f3e 100644
--- a/src/components/Footer.vue
+++ b/src/components/Footer.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n'
-import { isDark } from '/~/logics'
+import { isDark } from '~/logics'
 
 const { t, availableLocales, locale } = useI18n()
 
diff --git a/src/modules/README.md b/src/modules/README.md
index 2176f99..adda9ef 100644
--- a/src/modules/README.md
+++ b/src/modules/README.md
@@ -3,7 +3,7 @@
 A custom user module system. Place a `.ts` file with the following template, it will be installed automatically.
 
 ```ts
-import { UserModule } from '/~/types'
+import { UserModule } from '~/types'
 
 export const install: UserModule = ({ app, router, isClient }) => {
   // do something
diff --git a/src/modules/i18n.ts b/src/modules/i18n.ts
index 7b60763..ef6f0b1 100644
--- a/src/modules/i18n.ts
+++ b/src/modules/i18n.ts
@@ -1,5 +1,5 @@
 import { createI18n } from 'vue-i18n'
-import { UserModule } from '/~/types'
+import { UserModule } from '~/types'
 
 // import i18n resources
 // https://vitejs.dev/guide/features.html#glob-import
diff --git a/src/modules/nprogress.ts b/src/modules/nprogress.ts
index 77d3a86..8019b41 100644
--- a/src/modules/nprogress.ts
+++ b/src/modules/nprogress.ts
@@ -1,5 +1,5 @@
 import NProgress from 'nprogress'
-import { UserModule } from '/~/types'
+import { UserModule } from '~/types'
 
 export const install: UserModule = ({ isClient, router }) => {
   if (isClient) {
diff --git a/src/pages/README.md b/src/pages/README.md
index e3504dd..68ba324 100644
--- a/src/pages/README.md
+++ b/src/pages/README.md
@@ -5,7 +5,7 @@ Check out [`vite-plugin-pages`](https://github.com/hannoeru/vite-plugin-pages) f
 
 ### Path Aliasing
 
-`/~/` is aliased to `./src/` folder.
+`~/` is aliased to `./src/` folder.
 
 For example, instead of having
 
@@ -16,5 +16,5 @@ import { isDark } from '../../../../logics'
 now you can use
 
 ```ts
-import { isDark } from '/~/logics'
+import { isDark } from '~/logics'
 ```
diff --git a/tsconfig.json b/tsconfig.json
index c829625..60262f5 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -15,7 +15,7 @@
     "forceConsistentCasingInFileNames": true,
     "types": ["vite/client"],
     "paths": {
-      "/~/*": ["src/*"]
+      "~/*": ["src/*"]
     }
   },
   "exclude": ["dist", "node_modules"]
diff --git a/vite.config.ts b/vite.config.ts
index 0829303..1767621 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -5,13 +5,13 @@ import Pages from 'vite-plugin-pages'
 import ViteIcons, { ViteIconsResolver } from 'vite-plugin-icons'
 import ViteComponents from 'vite-plugin-components'
 import Markdown from 'vite-plugin-md'
-import VitePWA from 'vite-plugin-pwa'
+import { VitePWA } from 'vite-plugin-pwa'
 import VueI18n from '@intlify/vite-plugin-vue-i18n'
 import Prism from 'markdown-it-prism'
 
 export default defineConfig({
   alias: {
-    '/~/': `${path.resolve(__dirname, 'src')}/`,
+    '~/': `${path.resolve(__dirname, 'src')}/`,
   },
   plugins: [
     Vue({
@@ -56,6 +56,7 @@ export default defineConfig({
 
     // https://github.com/antfu/vite-plugin-pwa
     VitePWA({
+      inlineRegister: false,
       manifest: {
         name: 'Vitesse',
         short_name: 'Vitesse',
@@ -80,4 +81,9 @@ export default defineConfig({
       include: [path.resolve(__dirname, 'locales/**')],
     }),
   ],
+  // https://github.com/antfu/vite-ssg
+  ssgOptions: {
+    script: 'async',
+    formatting: 'minify',
+  },
 })
