Fix Nuxt V4 upgrade Fix (#411)

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Farnabaz <farnabaz@gmail.com>

Author: 3 people

package.json

@@ -68,7 +68,7 @@
     "verify": "npm run dev:prepare && npm run lint && npm run test && npm run typecheck"
   },
   "dependencies": {
-    "@nuxt/kit": "^3.17.7",
+    "@nuxt/kit": "^4.0.3",
     "@shikijs/langs": "^3.8.0",
     "@shikijs/themes": "^3.8.0",
     "@shikijs/transformers": "^3.8.0",
@@ -115,13 +115,13 @@
     "@nuxt/devtools": "^2.6.2",
     "@nuxt/eslint-config": "^1.5.2",
     "@nuxt/module-builder": "^1.0.1",
-    "@nuxt/schema": "^3.17.7",
+    "@nuxt/schema": "^4.0.3",
     "@nuxt/test-utils": "^3.19.2",
     "@nuxt/ui": "^3.2.0",
     "@nuxtjs/mdc": "link:.",
     "@types/node": "^24.0.13",
     "eslint": "^9.31.0",
-    "nuxt": "^3.17.7",
+    "nuxt": "^4.0.3",
     "rehype": "^13.0.2",
     "release-it": "^19.0.3",
     "typescript": "5.8.3",

playground/package.json

@@ -12,6 +12,6 @@
     "@monaco-editor/loader": "^1.5.0",
     "@nuxtjs/mdc": "workspace:*",
     "@nuxtlabs/monarch-mdc": "^0.8.0",
-    "nuxt": "^3.17.7"
+    "nuxt": "^4.0.3"
   }
 }

pnpm-lock.yaml

@@ -228,7 +228,7 @@ function _renderSlots(node: MDCNode, h: CreateElement, options: MDCRenderOptions
 
   const slotNodes: Record<string, { props?: Record<string, any>, children: MDCNode[] }> = children.reduce((data, node) => {
     if (!isTemplate(node)) {
-      data[DEFAULT_SLOT].children.push(node)
+      data[DEFAULT_SLOT]!.children.push(node)
       return data
     }
 
@@ -445,7 +445,7 @@ function getSlotName(node: MDCNode) {
       continue
     }
     // Get slot name
-    name = propName.split(/[:#]/, 2)[1]
+    name = propName.split(/[:#]/, 2)[1]!
     break
   }
   return name || DEFAULT_SLOT

src/runtime/components/MDCRenderer.vue

@@ -106,7 +106,7 @@ export function createShikiHighlighter({
 
     if (typeof lang === 'string' && !loadedLanguages.includes(lang) && !isSpecialLang(lang)) {
       if (bundledLangs[lang]) {
-        await shiki.loadLanguage(bundledLangs[lang])
+        await shiki.loadLanguage(bundledLangs[lang]!)
       } else {
         // eslint-disable-next-line nuxt/prefer-import-meta
         if (process.dev) {
@@ -165,9 +165,9 @@ export function createShikiHighlighter({
             if (code?.includes('\n')) {
               // Set newline for empty lines
               if (node.children.length === 0 || (
-                node.children.length === 1 && node.children[0].type === 'element'
-                && node.children[0].children.length === 1 && node.children[0].children[0].type === 'text'
-                && node.children[0].children[0].value === ''
+                node.children.length === 1 && node.children[0]!.type === 'element'
+                && node.children[0]!.children.length === 1 && node.children[0]!.children[0]!.type === 'text'
+                && node.children[0]!.children[0]!.value === ''
               )) {
                 node.children = [{
                   type: 'element',

src/runtime/highlighter/shiki.ts

@@ -119,7 +119,7 @@ export function compileHast(this: any, options: MDCParseOptions = {}) {
       // Include styles if excerpt contains code block
       if (excerpt.children.find(node => node.type === 'element' && node.tag === 'pre')) {
         const lastChild = body.children[body.children.length - 1]
-        if (lastChild.type === 'element' && lastChild.tag === 'style') {
+        if (lastChild && lastChild.type === 'element' && lastChild.tag === 'style') {
           excerpt.children.push(lastChild)
         }
       }

src/runtime/parser/compiler.ts

@@ -16,7 +16,8 @@ export default function list(state: State, node: List) {
     const child = results[index]
 
     if (
-      child.type === 'element'
+      child
+      && child.type === 'element'
       && child.tagName === 'li'
       && child.properties
       && Array.isArray(child.properties.className)

src/runtime/parser/handlers/list.ts

@@ -48,7 +48,7 @@ function parseHighlightedLines(lines?: string | null) {
     .filter(Boolean)
     .flatMap((line) => {
       const [start, end] = line.trim().split('-').map(a => Number(a.trim()))
-      return Array.from({ length: (end || start) - start + 1 }).map((_, i) => start + i)
+      return Array.from({ length: (end || start || 0) - ((start || 0)) + 1 }).map((_, i) => (start || 0) + i)
     })
   return lineArray.length ? lineArray : undefined
 }

src/runtime/parser/handlers/utils.ts

@@ -69,13 +69,13 @@ export function mdcRemark(options?: Options | undefined | null) {
         return
       }
       if (index && parent && parent.children) {
-        if (index > 0 && parent.children[index - 1].type === 'text') {
+        if (index > 0 && parent.children[index - 1]?.type === 'text') {
           const text = parent.children[index - 1] as Text
           if (!['\n', ' ', '\t'].includes(text.value.slice(-1))) {
             text.value += ' '
           }
         }
-        if (index && index < parent.children.length - 1 && parent.children[index + 1].type === 'text') {
+        if (index && index < parent.children.length - 1 && parent.children[index + 1]?.type === 'text') {
           const text = parent.children[index + 1] as Text
           if (!['\n', ' ', '\t', ',', '.'].includes(text.value.slice(0, 1))) {
             text.value = ' ' + text.value
@@ -143,7 +143,7 @@ const mdcRemarkNodeHandlers = {
     }
 
     if (own.call(state.handlers, node.tagName)) {
-      return state.handlers[node.tagName](state, node as Element, parent) || undefined
+      return state.handlers[node.tagName]!(state, node as Element, parent) || undefined
     }
 
     // Unknown literal.

src/runtime/stringify/mdc-remark.ts

@@ -4,7 +4,7 @@ export function computeHighlightRanges(input: string[] | string) {
   let start = numbers[0]
 
   for (let i = 1; i <= numbers.length; i++) {
-    if (numbers[i] !== numbers[i - 1] + 1) {
+    if (numbers[i] !== numbers[i - 1]! + 1) {
       if (start === numbers[i - 1]) {
         ranges.push(`${start}`)
       } else {