refactor(nuxt-example): use new nuxt features

apps/www/package.json

@@ -44,7 +44,7 @@
   },
   "devDependencies": {
     "@luxass/eslint-config": "^4.9.0",
-    "@nuxt/devtools": "latest",
+    "@nuxt/devtools": "^1.3.9",
     "eslint": "^9.7.0",
     "eslint-plugin-tailwindcss": "^3.17.4",
     "typescript": "^5.5.3",

examples/with-nuxt/assets/css/tailwind.css → examples/with-nuxt/app/assets/css/tailwind.css

@@ -8,7 +8,7 @@ html {
 }
 
 * {
-  @apply dark:outline-white selection:dark:bg-neutral-700 selection:dark:text-white outline-black selection:bg-neutral-200 selection:text-black;
+  @apply outline-black selection:bg-neutral-200 selection:text-black;
 }
 
 html,
@@ -21,7 +21,7 @@ body,
 }
 
 body {
-  @apply text-neutral-900 bg-neutral-100 dark:text-neutral-300 dark:bg-neutral-900;
+  @apply text-neutral-900 bg-neutral-100;
 }
 
 #__nuxt {

examples/with-nuxt/components/Footer.vue → examples/with-nuxt/app/components/Footer.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import {
   url,
-} from "../.lesetid/example.json";
+} from "../../.lesetid/example.json";
 </script>
 
 <template>

examples/with-nuxt/components/Header.vue → examples/with-nuxt/app/components/Header.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import {
   url,
-} from "../.lesetid/example.json";
+} from "../../.lesetid/example.json";
 </script>
 
 <template>

examples/with-nuxt/components/PostCard.vue → examples/with-nuxt/app/components/PostCard.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { ContentWithEstimation } from "~/types";
+import type { ContentWithEstimation } from "../../types";
 
 const { post } = defineProps<{
   post: ContentWithEstimation;
@@ -20,8 +20,8 @@ const formattedDate = new Date(date).toLocaleDateString("en-US", {
 
 <template>
   <NuxtLink
-    :href="`/posts${post._path}`"
-    class="group flex max-w-sm cursor-pointer flex-col gap-2 rounded-md border border-neutral-300 p-4 transition-all duration-300 hover:-translate-y-2 hover:border-neutral-400 dark:border-neutral-700"
+    :href="post._path"
+    class="group flex max-w-sm cursor-pointer flex-col gap-2 rounded-md border border-neutral-300 p-4 transition-all duration-300 hover:-translate-y-2 hover:border-neutral-400"
   >
     <div class="flex w-full flex-col justify-between gap-2 md:flex-row md:items-center">
       <p>{{ title }}</p>

examples/with-nuxt/pages/index.vue → examples/with-nuxt/app/pages/index.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { ContentWithEstimation } from "~/types";
+import type { ContentWithEstimation } from "../../types";
 
 const posts = await queryContent<ContentWithEstimation>()
   .sort({

examples/with-nuxt/pages/posts/[handle].vue → examples/with-nuxt/app/pages/posts/[handle].vue

@@ -1,11 +1,11 @@
 <script setup lang="ts">
-import type { ContentWithEstimation } from "~/types";
+import type { ContentWithEstimation } from "../../../types";
 </script>
 
 <template>
   <ContentDoc v-slot="{ doc }">
-    <article class="markdown prose tracking-wide dark:prose-invert">
-      <div class="gap-3 rounded border border-neutral-300 p-3 dark:border-neutral-700">
+    <article class="markdown prose tracking-wide">
+      <div class="gap-3 rounded border border-neutral-300 p-3">
         This post will approximately take <strong>{{ (doc as ContentWithEstimation).estimation?.text || "NaN" }}</strong>
         to read.
       </div>

examples/with-nuxt/nuxt.config.ts

@@ -5,12 +5,8 @@ export default defineNuxtConfig({
     "nuxt-icon",
     "@nuxt/content",
     "@nuxtjs/tailwindcss",
-    "@nuxtjs/color-mode",
   ],
   sourcemap: false,
-  colorMode: {
-    classSuffix: "",
-  },
   app: {
     head: {
       viewport: "width=device-width,initial-scale=1",
@@ -33,7 +29,7 @@ export default defineNuxtConfig({
     },
   },
   future: {
-    typescriptBundlerResolution: true,
+    compatibilityVersion: 4,
   },
   routeRules: {
     "/": {
@@ -46,9 +42,7 @@ export default defineNuxtConfig({
   content: {
     highlight: {
       theme: {
-        default: "vitesse-dark",
-        dark: "vitesse-dark",
-        light: "vitesse-light",
+        default: "vitesse-light",
       },
     },
     markdown: {
@@ -60,7 +54,7 @@ export default defineNuxtConfig({
     },
   },
   nitro: {
-    preset: "netlify-builder",
+    preset: "netlify",
     prerender: {
       routes: ["/sitemap.xml"],
     },

examples/with-nuxt/package.json

@@ -26,30 +26,29 @@
     "preview": "nuxt preview",
     "postinstall": "nuxt prepare",
     "lint": "eslint . --report-unused-disable-directives",
-    "typecheck": "tsc --noEmit",
+    "typecheck": "vue-tsc --noEmit",
     "clean": "git clean -xdf .nuxt dist .output node_modules .turbo .netlify"
   },
   "dependencies": {
+    "nuxt": "^3.12.3",
+    "nuxt-icon": "^0.6.10",
     "remark-lesetid": "workspace:*",
-    "sitemap": "^8.0.0"
+    "sitemap": "^8.0.0",
+    "vue": "^3.4.32",
+    "vue-router": "^4.4.0"
   },
   "devDependencies": {
     "@luxass/eslint-config": "^4.9.0",
     "@nuxt/content": "^2.13.1",
-    "@nuxt/devtools": "latest",
+    "@nuxt/devtools": "^1.3.9",
     "@nuxt/image": "^1.7.0",
-    "@nuxtjs/color-mode": "^3.4.2",
     "@nuxtjs/fontaine": "^0.4.3",
     "@nuxtjs/tailwindcss": "^6.12.1",
     "@tailwindcss/typography": "^0.5.13",
-    "@unocss/eslint-plugin": "^0.61.5",
-    "@unocss/nuxt": "^0.61.5",
     "eslint": "^9.7.0",
-    "nuxt": "^3.12.3",
-    "nuxt-icon": "^0.6.10",
     "tailwindcss": "^3.4.6",
-    "vue": "^3.4.32",
-    "vue-router": "^4.4.0"
+    "typescript": "^5.5.3",
+    "vue-tsc": "^2.0.26"
   },
   "stackblitz": {
     "installDependencies": false,