feat: handle 404s

app/pages/[...slug].vue

@@ -0,0 +1,15 @@
+<template>
+  <UContainer class="flex flex-col items-center justify-center py-20 text-center">
+    <h1 class="text-9xl font-bold text-primary">404</h1>
+    <h2 class="text-3xl font-semibold mt-4">Oooooops!</h2>
+    <p class="text-muted-foreground my-6 max-w-md">
+      "/{{ Array.isArray($route.params.slug) ? $route.params.slug.join('/') : $route.params.slug || '' }}" doesn't exist.
+    </p>
+    <UButton 
+      to="/" 
+      size="lg" 
+      label="Return to Home" 
+      icon="i-octicon-home-fill-16" 
+    />
+  </UContainer>
+</template>

bun.lock

@@ -12,6 +12,7 @@
         "tailwindcss": "^4.3.0",
       },
       "devDependencies": {
+        "@iconify-json/octicon": "^1.2.23",
         "@nuxt/eslint": "^1.15.2",
         "eslint": "^10.3.0",
         "typescript": "^6.0.3",
@@ -196,6 +197,8 @@
 
     "@iconify-json/lucide": ["@iconify-json/lucide@1.2.106", "", { "dependencies": { "@iconify/types": "2.0.0" } }, "sha512-5nuejHR29A0iQjvLZRRPtuMyj1DA9pzcDMuHD4vmhG7GgLen8haMKiZcZ1IpKVZDwR8wxfcbCv9MsoWHBBAa+g=="],
 
+    "@iconify-json/octicon": ["@iconify-json/octicon@1.2.23", "", { "dependencies": { "@iconify/types": "*" } }, "sha512-Orzy6EGFBuqiME4WAyyv7Wr/RCOtf2EDUiCHBr0glTMyPQWwtZqribj9UEbDPE/ZMlwx79YrQ7sOoDQv1pVqRQ=="],
+
     "@iconify-json/simple-icons": ["@iconify-json/simple-icons@1.2.81", "", { "dependencies": { "@iconify/types": "2.0.0" } }, "sha512-Utjw4sPtoVdbpAQAkC4O0cYpt4ehQZYr6aFHhmvdeW8mQwkINyAe0ogTPqNptSSKogZ2lfgXM8zpuhO961Wnng=="],
 
     "@iconify/collections": ["@iconify/collections@1.0.677", "", { "dependencies": { "@iconify/types": "2.0.0" } }, "sha512-Uwbl1p26Md6m2xTMjalJsmQ43YxW+j6RsyrL5RnxRCHEhwympJlaBBCGTKrqI3sA93g9UVJ/Pxi7zDqM3E1oPw=="],

nuxt.config.ts

@@ -1,5 +1,6 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
+  srcDir: 'app/',
   modules: [
     '@nuxt/eslint',
     '@nuxt/ui'

package.json

@@ -18,6 +18,7 @@
     "tailwindcss": "^4.3.0"
   },
   "devDependencies": {
+    "@iconify-json/octicon": "^1.2.23",
     "@nuxt/eslint": "^1.15.2",
     "eslint": "^10.3.0",
     "typescript": "^6.0.3",