chore: Update dependencies and configuration for Next.js project

Author: longsizhuo

.contentlayer/generated/index.mjs

@@ -4,7 +4,7 @@ export { isType } from 'contentlayer/client'
 
 // NOTE During development Contentlayer imports from `.mjs` files to improve HMR speeds.
 // During (production) builds Contentlayer it imports from `.json` files to improve build performance.
-import { allDocs } from './Doc/_index.mjs'
+import allDocs from './Doc/_index.json' assert { type: 'json' }
 
 export { allDocs }
 

app/components/MDXContent.tsx

@@ -0,0 +1,8 @@
+"use client"
+
+import { useMDXComponent } from 'next-contentlayer/hooks'
+
+export default function MDXContent({ code }: { code: string }) {
+  const MDX = useMDXComponent(code)
+  return <MDX />
+}

app/docs/[slug]/page.tsx

@@ -1,21 +1,20 @@
 import { allDocs } from 'contentlayer/generated'
 import { notFound } from 'next/navigation'
-import { useMDXComponent } from 'next-contentlayer/hooks'
+import MDXContent from '@/app/components/MDXContent'
 
 export function generateStaticParams() {
   return allDocs.map((d) => ({ slug: d.slug }))
 }
 
-export default function DocPage({ params }: { params: { slug: string } }) {
-  const doc = allDocs.find((d) => d.slug === params.slug)
+export default async function DocPage({ params }: { params: Promise<{ slug: string }> }) {
+  const { slug } = await params
+  const doc = allDocs.find((d) => d.slug === slug)
   if (!doc) return notFound()
 
-  const MDX = useMDXComponent(doc.body.code)
-
   return (
     <article style={{ maxWidth: 820, margin: '40px auto', padding: 16 }}>
       <h1 style={{ fontSize: 32, fontWeight: 800, marginBottom: 16 }}>{doc.title}</h1>
-      <MDX />
+      <MDXContent code={doc.body.code} />
     </article>
   )
 }

package.json

@@ -4,28 +4,28 @@
   "private": true,
   "scripts": {
     "dev": "next dev",
-    "build": "next build && contentlayer build",
+    "build": "next build",
     "export": "next build && next export",
     "start": "next start"
   },
   "dependencies": {
-    "next": "14.2.32",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
+    "next": "^15.5.3",
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1",
     "rehype-autolink-headings": "^7.1.0",
     "rehype-slug": "^6.0.0",
     "remark-gfm": "^4.0.1"
   },
   "devDependencies": {
-    "@types/node": "^20",
-    "@types/react": "^18",
-    "@types/react-dom": "^18",
+    "@types/node": "^24.3.1",
+    "@types/react": "^19.1.12",
+    "@types/react-dom": "^19.1.9",
     "contentlayer": "^0.3.4",
-    "eslint": "^8",
-    "eslint-config-next": "14.2.32",
+    "eslint": "^9.35.0",
+    "eslint-config-next": "^15.5.3",
     "next-contentlayer": "^0.3.4",
-    "postcss": "^8",
-    "tailwindcss": "^3.4.1",
-    "typescript": "^5"
+    "postcss": "^8.5.6",
+    "tailwindcss": "^3.4.17",
+    "typescript": "^5.6.3"
   }
 }