chore: upgrade to Nuxt 4 (#3499)

farnabaz · larbish · web-flow · commit f47602178196 · 2025-08-06T15:23:22.000+02:00
Co-authored-by: Baptiste Leproux &lt;leproux.baptiste@gmail.com&gt;
diff --git a/docs/app/app.vue b/docs/app/app.vue
@@ -30,6 +30,8 @@ useSeoMeta({
 })
 
 provide('navigation', navigation)
+
+// z-[-1] remove when docus is fixed
 </script>
 
 <template>
diff --git a/docs/nuxt.config.ts b/docs/nuxt.config.ts
@@ -4,7 +4,7 @@ import { defineNuxtConfig } from 'nuxt/config'
 
 export default defineNuxtConfig({
   modules: ['@nuxtjs/plausible', '@vueuse/nuxt', '@nuxthub/core'],
-  css: ['../app/assets/css/main.css'],
+  // css: ['../app/assets/css/main.css'],
   site: {
     name: 'Nuxt Content',
     url: 'https://content.nuxt.com',
diff --git a/docs/package.json b/docs/package.json
@@ -1,17 +1,17 @@
 {
   "name": "docus-starter",
   "scripts": {
-    "dev": "docus dev",
-    "build": "docus build"
+    "dev": "nuxt dev -e docus",
+    "build": "nuxt build -e docus"
   },
   "dependencies": {
     "@nuxt/content": "link:..",
     "@nuxthub/core": "0.9.0",
     "@nuxtjs/plausible": "^1.2.0",
-    "@vueuse/nuxt": "^13.5.0",
+    "@vueuse/nuxt": "^13.6.0",
     "better-sqlite3": "^12.2.0",
-    "docus": "3.0.5",
+    "docus": "4.0.3",
     "minisearch": "^7.1.2",
-    "nuxt": "^3.17.6"
+    "nuxt": "^4.0.3"
   }
 }
diff --git a/examples/basic/package.json b/examples/basic/package.json
@@ -10,6 +10,6 @@
   },
   "dependencies": {
     "@nuxt/content": "latest",
-    "nuxt": "^3.17.6"
+    "nuxt": "^4.0.3"
   }
 }
diff --git a/examples/blog/package.json b/examples/blog/package.json
@@ -11,6 +11,6 @@
   },
   "dependencies": {
     "@nuxt/content": "latest",
-    "nuxt": "^3.17.6"
+    "nuxt": "^4.0.3"
   }
 }
diff --git a/examples/i18n/package.json b/examples/i18n/package.json
@@ -10,9 +10,9 @@
   },
   "dependencies": {
     "@nuxt/content": "latest",
-    "@nuxt/ui-pro": "^3.2.0",
+    "@nuxt/ui-pro": "^3.3.0",
     "@nuxthub/core": "0.9.0",
-    "@nuxtjs/i18n": "^10.0.1",
-    "nuxt": "^3.17.6"
+    "@nuxtjs/i18n": "^10.0.3",
+    "nuxt": "^4.0.3"
   }
 }
diff --git a/examples/ui-pro/package.json b/examples/ui-pro/package.json
@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "@nuxt/content": "latest",
-    "@nuxt/ui-pro": "^3.2.0",
-    "nuxt": "^3.17.6"
+    "@nuxt/ui-pro": "^3.3.0",
+    "nuxt": "^4.0.3"
   }
 }
diff --git a/package.json b/package.json
@@ -42,13 +42,13 @@
   ],
   "scripts": {
     "prepack": "nuxt-module-build build",
-    "typecheck": "nuxi typecheck",
-    "example": "run () { nuxi dev examples/$*; }; run",
-    "docs": "docus dev docs",
-    "docs:build": "docus build docs",
-    "dev": "nuxi dev playground",
-    "dev:build": "nuxi build playground",
-    "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
+    "typecheck": "nuxt typecheck",
+    "example": "run () { nuxt dev examples/$*; }; run",
+    "docs": "nuxt dev -e docus docs",
+    "docs:build": "nuxt-module-build build && nuxt build -e docus docs",
+    "dev": "nuxt dev playground",
+    "dev:build": "nuxt build playground",
+    "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxt prepare playground && nuxt prepare docs -e docus",
     "release": "npm run lint && npm run test && npm run prepack && release-it",
     "lint": "eslint .",
     "test": "vitest run",
@@ -58,7 +58,7 @@
     "verify": "npm run dev:prepare && npm run lint && npm run test && npm run typecheck"
   },
   "dependencies": {
-    "@nuxt/kit": "^3.17.6",
+    "@nuxt/kit": "^4.0.3",
     "@nuxtjs/mdc": "^0.17.2",
     "@shikijs/langs": "^3.9.2",
     "@sqlite.org/sqlite-wasm": "3.50.3-build1",
@@ -129,9 +129,9 @@
     "@nuxt/content": "link:.",
     "@nuxt/devtools": "^2.6.2",
     "@nuxt/eslint-config": "^1.7.1",
-    "@nuxt/kit": "^3.17.6",
+    "@nuxt/kit": "^4.0.3",
     "@nuxt/module-builder": "^1.0.2",
-    "@nuxt/schema": "^3.17.6",
+    "@nuxt/schema": "^4.0.3",
     "@nuxt/test-utils": "^3.19.2",
     "@release-it/conventional-changelog": "^10.0.1",
     "@types/better-sqlite3": "^7.6.13",
@@ -146,12 +146,12 @@
     "happy-dom": "^18.0.1",
     "mdclint": "^0.0.3",
     "micromark-util-types": "^2.0.2",
-    "nuxt": "^3.17.6",
+    "nuxt": "^4.0.3",
     "release-it": "^19.0.4",
     "typescript": "5.9.2",
     "vitest": "^3.2.4",
     "vue-tsc": "^3.0.5",
-    "wrangler": "^4.27.0"
+    "wrangler": "^4.28.0"
   },
   "resolutions": {
     "@nuxt/content": "workspace:*"
diff --git a/playground/package.json b/playground/package.json
@@ -10,9 +10,9 @@
   },
   "devDependencies": {
     "@nuxt/content": "latest",
-    "@nuxt/ui-pro": "^3.2.0",
+    "@nuxt/ui-pro": "^3.3.0",
     "@nuxthub/core": "^0.9.0",
-    "nuxt": "^3.17.6",
+    "nuxt": "^4.0.3",
     "remark-code-import": "^1.2.0",
     "shiki-transformer-color-highlight": "^1.0.0"
   }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/presets/aws-amplify.ts b/src/presets/aws-amplify.ts
@@ -12,7 +12,7 @@ export default definePreset({
     // Disable prerendering to avoid fetching assets on server side
     Object.keys(nuxt.options.routeRules || {}).forEach((route) => {
       if (route.startsWith('/__nuxt_content/') && route.endsWith('/sql_dump.txt')) {
-        nuxt.options.routeRules![route].prerender = false
+        nuxt.options.routeRules![route]!.prerender = false
       }
     })
 
diff --git a/src/runtime/internal/collection.ts b/src/runtime/internal/collection.ts
@@ -27,7 +27,7 @@ function findCollectionFields(sql: string): Record<string, 'string' | 'number' |
     return {}
   }
 
-  const info = contentManifest[getCollectionName(table[1]) as keyof typeof contentManifest] as CollectionInfo
+  const info = contentManifest[getCollectionName(table[1]!) as keyof typeof contentManifest] as CollectionInfo
   return info?.fields || {}
 }
 
diff --git a/src/runtime/internal/database.client.ts b/src/runtime/internal/database.client.ts
@@ -110,7 +110,7 @@ async function loadCollectionDatabase<T>(collection: T) {
       compressedDump = await fetchDatabase(undefined, String(collection))
       if (!import.meta.dev) {
         try {
-          window.localStorage.setItem(`content_${checksumId}`, checksums[String(collection)])
+          window.localStorage.setItem(`content_${checksumId}`, checksums[String(collection)]!)
           window.localStorage.setItem(`content_${dumpId}`, compressedDump!)
         }
         catch (error) {
diff --git a/src/runtime/internal/database.server.ts b/src/runtime/internal/database.server.ts
@@ -43,7 +43,7 @@ const integrityCheckPromise = {} as Record<string, Promise<void> | null>
 export async function checkAndImportDatabaseIntegrity(event: H3Event, collection: string, config: RuntimeConfig['content']): Promise<void> {
   if (checkDatabaseIntegrity[String(collection)] !== false) {
     checkDatabaseIntegrity[String(collection)] = false
-    integrityCheckPromise[String(collection)] = integrityCheckPromise[String(collection)] || _checkAndImportDatabaseIntegrity(event, collection, checksums[String(collection)], checksumsStructure[String(collection)], config)
+    integrityCheckPromise[String(collection)] = integrityCheckPromise[String(collection)] || _checkAndImportDatabaseIntegrity(event, collection, checksums[String(collection)]!, checksumsStructure[String(collection)]!, config)
       .then((isValid) => {
         checkDatabaseIntegrity[String(collection)] = !isValid
       })
diff --git a/src/runtime/internal/preview/collection.ts b/src/runtime/internal/preview/collection.ts
@@ -120,7 +120,7 @@ function computeValuesBasedOnCollectionSchema(collection: CollectionInfo, data:
   sortedKeys.forEach((key) => {
     const value = (properties)[key]
     const type = collection.fields[key]
-    const defaultValue = value.default !== undefined ? value.default : 'NULL'
+    const defaultValue = value?.default !== undefined ? value.default : 'NULL'
     const valueToInsert = typeof data[key] !== 'undefined' ? data[key] : defaultValue
 
     fields.push(key)
diff --git a/src/runtime/internal/schema.ts b/src/runtime/internal/schema.ts
@@ -10,7 +10,7 @@ const propertyTypes = {
 }
 
 export function getOrderedSchemaKeys(schema: Draft07) {
-  const shape = Object.values(schema.definitions)[0].properties
+  const shape = Object.values(schema.definitions)[0]?.properties || {}
   const keys = new Set([
     shape.id ? 'id' : undefined,
     shape.title ? 'title' : undefined,
@@ -47,8 +47,8 @@ function getPropertyType(property: Draft07DefinitionProperty | Draft07Definition
     const nullIndex = anyOf.findIndex(t => t.type === 'null')
     if (anyOf.length === 2 && nullIndex !== -1) {
       type = nullIndex === 0
-        ? getPropertyType(anyOf[1])
-        : getPropertyType(anyOf[0])
+        ? getPropertyType(anyOf[1]!)
+        : getPropertyType(anyOf[0]!)
     }
   }
 
@@ -63,7 +63,7 @@ function getPropertyType(property: Draft07DefinitionProperty | Draft07Definition
 
 export function describeProperty(schema: Draft07, property: string) {
   const def = Object.values(schema.definitions)[0]
-  const shape = def.properties
+  const shape = def?.properties || {}
   if (!shape[property]) {
     throw new Error(`Property ${property} not found in schema`)
   }
@@ -93,7 +93,7 @@ export function describeProperty(schema: Draft07, property: string) {
   if ('default' in shape[property]) {
     result.default = shape[property].default
   }
-  else if (!def.required.includes(property)) {
+  else if (!def?.required.includes(property)) {
     result.nullable = true
   }
 
diff --git a/src/runtime/internal/security.ts b/src/runtime/internal/security.ts
@@ -31,12 +31,12 @@ export function assertSafeQuery(sql: string, collection: string) {
   const [_, select, from, where, orderBy, order, limit, offset] = match
 
   // COLUMNS
-  const columns = select.trim().split(', ')
+  const columns = select?.trim().split(', ') || []
   if (columns.length === 1) {
     if (
       columns[0] !== '*'
-      && !columns[0].match(SQL_COUNT_REGEX)
-      && !columns[0].match(/^"[a-z_]\w+"$/i)
+      && !columns[0]?.match(SQL_COUNT_REGEX)
+      && !columns[0]?.match(/^"[a-z_]\w+"$/i)
     ) {
       throw new Error('Invalid query')
     }
diff --git a/src/utils/collection.ts b/src/utils/collection.ts
@@ -192,7 +192,7 @@ export function generateCollectionInsert(collection: ResolvedCollection, data: P
   // Take the biggest column to insert (usually body) and split the column in multiple strings
   // first we insert the row in the database, then we update it with the rest of the string by concatenation
   const biggestColumn = [...values].sort((a, b) => String(b).length - String(a).length)[0]
-  const bigColumnIndex = values.indexOf(biggestColumn)
+  const bigColumnIndex = values.indexOf(biggestColumn!)
   const bigColumnName = fields[bigColumnIndex]
 
   if (typeof biggestColumn === 'string') {
diff --git a/src/utils/database.ts b/src/utils/database.ts
@@ -116,7 +116,7 @@ export async function getLocalDatabase(database: SqliteDatabaseConfig | D1Databa
     }
     // Initialize the database version
     if (dropCacheTable) {
-      await db.exec(generateCollectionInsert(cacheCollection, { id: '__DATABASE_VERSION__', value: databaseVersion, checksum: databaseVersion }).queries[0])
+      await db.exec(generateCollectionInsert(cacheCollection, { id: '__DATABASE_VERSION__', value: databaseVersion, checksum: databaseVersion }).queries[0]!)
     }
   }
 
diff --git a/src/utils/dev.ts b/src/utils/dev.ts
@@ -60,16 +60,16 @@ export async function startSocketServer(nuxt: Nuxt, options: ModuleOptions, mani
       await Promise.all(insertQuery.map(query => db.exec(query)))
     }
 
-    const collectionDump = manifest.dump[collection.name]
-    const keyIndex = collectionDump?.findIndex(item => item.includes(`'${key}'`))
-    const indexToUpdate = keyIndex !== -1 ? keyIndex : collectionDump?.length
+    const collectionDump = manifest.dump[collection.name]!
+    const keyIndex = collectionDump.findIndex(item => item.includes(`'${key}'`))
+    const indexToUpdate = keyIndex !== -1 ? keyIndex : collectionDump.length
     const itemsToRemove = keyIndex === -1 ? 0 : 1
 
     if (insertQuery) {
-      collectionDump?.splice(indexToUpdate, itemsToRemove, ...insertQuery)
+      collectionDump.splice(indexToUpdate, itemsToRemove, ...insertQuery)
     }
     else {
-      collectionDump?.splice(indexToUpdate, itemsToRemove)
+      collectionDump.splice(indexToUpdate, itemsToRemove)
     }
 
     updateTemplates({
diff --git a/src/utils/git.ts b/src/utils/git.ts
@@ -74,7 +74,7 @@ export function parseGitHubUrl(url: string) {
 
     if (['fix', 'feat', 'chore', 'test', 'docs'].includes(branch)) {
       const pathParts = path.split('/')
-      branch = join(branch, pathParts[0])
+      branch = join(branch, pathParts[0] || '')
       path = pathParts.slice(1).join('/')
     }
 
@@ -101,7 +101,7 @@ export function parseBitBucketUrl(url: string) {
 
     if (['fix', 'feat', 'chore', 'test', 'docs'].includes(branch)) {
       const pathParts = path.split('/')
-      branch = join(branch, pathParts[0])
+      branch = join(branch, pathParts[0] || '')
       path = pathParts.slice(1).join('/')
     }
 
diff --git a/src/utils/templates.ts b/src/utils/templates.ts
@@ -199,7 +199,7 @@ export const previewTemplate = (collections: ResolvedCollection[], gitInfo: GitI
       const schemaWithCollectionName = {
         ...collection.extendedSchema,
         definitions: {
-          [collection.name]: collection.extendedSchema.definitions['__SCHEMA__'],
+          [collection.name]: collection.extendedSchema.definitions['__SCHEMA__']!,
         },
       }
       acc[collection.name] = {
diff --git a/vitest.config.ts b/vitest.config.ts
@@ -3,7 +3,7 @@ import { defineVitestConfig } from '@nuxt/test-utils/config'
 
 export default defineVitestConfig({
   test: {
-    environment: 'node',
+    environment: 'nuxt',
     alias: {
       '#content/manifest': resolve('./test/mock/content-manifest.ts'),
     },

Original file line number	Diff line number	Diff line change
`@@ -10,6 +10,6 @@`
`10`	`10`	`},`
`11`	`11`	`"dependencies": {`
`12`	`12`	`"@nuxt/content": "latest",`
`13`		`- "nuxt": "^3.17.6"`
	`13`	`+ "nuxt": "^4.0.3"`
`14`	`14`	`}`
`15`	`15`	`}`
Original file line number	Diff line number	Diff line change
`@@ -11,6 +11,6 @@`
`11`	`11`	`},`
`12`	`12`	`"dependencies": {`
`13`	`13`	`"@nuxt/content": "latest",`
`14`		`- "nuxt": "^3.17.6"`
	`14`	`+ "nuxt": "^4.0.3"`
`15`	`15`	`}`
`16`	`16`	`}`
Original file line number	Diff line number	Diff line change
`@@ -10,9 +10,9 @@`
`10`	`10`	`},`
`11`	`11`	`"dependencies": {`
`12`	`12`	`"@nuxt/content": "latest",`
`13`		`- "@nuxt/ui-pro": "^3.2.0",`
	`13`	`+ "@nuxt/ui-pro": "^3.3.0",`
`14`	`14`	`"@nuxthub/core": "0.9.0",`
`15`		`- "@nuxtjs/i18n": "^10.0.1",`
`16`		`- "nuxt": "^3.17.6"`
	`15`	`+ "@nuxtjs/i18n": "^10.0.3",`
	`16`	`+ "nuxt": "^4.0.3"`
`17`	`17`	`}`
`18`	`18`	`}`
Original file line number	Diff line number	Diff line change
`@@ -10,7 +10,7 @@`
`10`	`10`	`},`
`11`	`11`	`"dependencies": {`
`12`	`12`	`"@nuxt/content": "latest",`
`13`		`- "@nuxt/ui-pro": "^3.2.0",`
`14`		`- "nuxt": "^3.17.6"`
	`13`	`+ "@nuxt/ui-pro": "^3.3.0",`
	`14`	`+ "nuxt": "^4.0.3"`
`15`	`15`	`}`
`16`	`16`	`}`