Merge branch 'main' into feat/add-chunkError-automatic-navigation-and-lazy-plugin

package.json

@@ -39,18 +39,20 @@
     "@nuxt/ui-templates": "workspace:*",
     "@nuxt/vite-builder": "workspace:*",
     "@nuxt/webpack-builder": "workspace:*",
-    "@types/node": "20.16.3",
+    "@types/node": "20.16.5",
     "c12": "2.0.0-beta.2",
     "h3": "npm:h3-nightly@2.0.0-1718872656.6765a6e",
     "jiti": "2.0.0-beta.3",
     "magic-string": "^0.30.11",
     "nitro": "npm:nitro-nightly@3.0.0-beta-28665895.e727afda",
     "nuxt": "workspace:*",
-    "rollup": "^4.21.2",
+    "postcss": "8.4.45",
+    "rollup": "4.21.2",
     "typescript": "5.5.4",
+    "ufo": "1.5.4",
     "unbuild": "3.0.0-rc.7",
     "vite": "5.4.3",
-    "vue": "3.5.0"
+    "vue": "3.5.2"
   },
   "devDependencies": {
     "@eslint/js": "9.9.1",
@@ -60,7 +62,7 @@
     "@nuxt/webpack-builder": "workspace:*",
     "@testing-library/vue": "8.1.0",
     "@types/eslint__js": "8.42.3",
-    "@types/node": "20.16.3",
+    "@types/node": "20.16.5",
     "@types/semver": "7.5.8",
     "@unhead/schema": "1.10.4",
     "@unhead/vue": "1.10.4",
@@ -71,12 +73,12 @@
     "case-police": "0.7.0",
     "changelogen": "0.5.5",
     "consola": "3.2.3",
-    "cssnano": "7.0.5",
+    "cssnano": "7.0.6",
     "destr": "2.0.3",
     "devalue": "5.0.0",
     "eslint": "9.9.1",
     "eslint-plugin-no-only-tests": "3.3.0",
-    "eslint-plugin-perfectionist": "3.3.0",
+    "eslint-plugin-perfectionist": "3.4.0",
     "eslint-typegen": "0.3.1",
     "h3": "npm:h3-nightly@2.0.0-1718872656.6765a6e",
     "happy-dom": "15.7.3",
@@ -99,9 +101,9 @@
     "ufo": "1.5.4",
     "vitest": "2.0.5",
     "vitest-environment-nuxt": "1.0.1",
-    "vue": "3.5.0",
+    "vue": "3.5.2",
     "vue-router": "4.4.3",
-    "vue-tsc": "2.1.4"
+    "vue-tsc": "2.1.6"
   },
   "packageManager": "pnpm@9.9.0",
   "engines": {

packages/nuxt/package.json

@@ -68,7 +68,7 @@
     "@unhead/dom": "^1.10.4",
     "@unhead/ssr": "^1.10.4",
     "@unhead/vue": "^1.10.4",
-    "@vue/shared": "^3.5.0",
+    "@vue/shared": "^3.5.2",
     "acorn": "8.12.1",
     "c12": "^2.0.0-beta.2",
     "chokidar": "^3.6.0",
@@ -113,22 +113,22 @@
     "unctx": "^2.3.1",
     "unenv": "^1.10.0",
     "unimport": "^3.11.1",
-    "unplugin": "^1.12.3",
+    "unplugin": "^1.13.1",
     "unplugin-vue-router": "^0.10.7",
-    "unstorage": "^1.10.2",
+    "unstorage": "^1.11.1",
     "untyped": "^1.4.2",
-    "vue": "^3.5.0",
+    "vue": "^3.5.2",
     "vue-bundle-renderer": "^2.1.0",
     "vue-devtools-stub": "^0.1.0",
     "vue-router": "^4.4.3"
   },
   "devDependencies": {
-    "@nuxt/scripts": "0.8.0",
+    "@nuxt/scripts": "0.8.3",
     "@nuxt/ui-templates": "1.3.4",
     "@parcel/watcher": "2.4.1",
     "@types/estree": "1.0.5",
     "@vitejs/plugin-vue": "5.1.3",
-    "@vue/compiler-sfc": "3.5.0",
+    "@vue/compiler-sfc": "3.5.2",
     "unbuild": "3.0.0-rc.7",
     "vite": "5.4.3",
     "vitest": "2.0.5"

packages/nuxt/src/app/components/route-provider.ts

@@ -27,6 +27,7 @@ export const RouteProvider = defineComponent({
     for (const key in props.route) {
       Object.defineProperty(route, key, {
         get: () => previousKey === props.renderKey ? props.route[key as keyof RouteLocationNormalizedLoaded] : previousRoute[key as keyof RouteLocationNormalizedLoaded],
+        enumerable: true,
       })
     }
 

packages/nuxt/src/app/composables/component.ts

@@ -16,7 +16,7 @@ async function runLegacyAsyncData (res: Record<string, any> | Promise<Record<str
   const { fetchKey, _fetchKeyBase } = vm.proxy!.$options
   const key = (typeof fetchKey === 'function' ? fetchKey(() => '') : fetchKey) ||
     ([_fetchKeyBase, route.fullPath, route.matched.findIndex(r => Object.values(r.components || {}).includes(vm.type))].join(':'))
-  const { data, error } = await useAsyncData(`options:asyncdata:${key}`, () => nuxtApp.runWithContext(() => fn(nuxtApp)))
+  const { data, error } = await useAsyncData(`options:asyncdata:${key}`, () => import.meta.server ? nuxtApp.runWithContext(() => fn(nuxtApp)) : fn(nuxtApp))
   if (error.value) {
     throw createError(error.value)
   }

packages/nuxt/src/components/module.ts

@@ -1,6 +1,6 @@
-import fs, { statSync } from 'node:fs'
+import { existsSync, statSync, writeFileSync } from 'node:fs'
 import { join, normalize, relative, resolve } from 'pathe'
-import { addPluginTemplate, addTemplate, addTypeTemplate, addVitePlugin, addWebpackPlugin, defineNuxtModule, logger, resolveAlias, updateTemplates } from '@nuxt/kit'
+import { addPluginTemplate, addTemplate, addTypeTemplate, addVitePlugin, addWebpackPlugin, defineNuxtModule, logger, resolveAlias, resolvePath, updateTemplates } from '@nuxt/kit'
 import type { Component, ComponentsDir, ComponentsOptions } from 'nuxt/schema'
 
 import { distDir } from '../dirs'
@@ -169,6 +169,10 @@ export default defineNuxtModule<ComponentsOptions>({
       await nuxt.callHook('components:extend', newComponents)
       // add server placeholder for .client components server side. issue: #7085
       for (const component of newComponents) {
+        if (!(component as any /* untyped internal property */)._scanned && !(component.filePath in nuxt.vfs) && !existsSync(component.filePath)) {
+          // attempt to resolve component path
+          component.filePath = await resolvePath(component.filePath)
+        }
         if (component.mode === 'client' && !newComponents.some(c => c.pascalName === component.pascalName && c.mode === 'server')) {
           newComponents.push({
             ...component,
@@ -236,17 +240,17 @@ export default defineNuxtModule<ComponentsOptions>({
         const selectiveClient = typeof nuxt.options.experimental.componentIslands === 'object' && nuxt.options.experimental.componentIslands.selectiveClient
 
         if (isClient && selectiveClient) {
-          fs.writeFileSync(join(nuxt.options.buildDir, 'components-chunk.mjs'), 'export const paths = {}')
+          writeFileSync(join(nuxt.options.buildDir, 'components-chunk.mjs'), 'export const paths = {}')
           if (!nuxt.options.dev) {
             config.plugins.push(componentsChunkPlugin.vite({
               getComponents,
               buildDir: nuxt.options.buildDir,
             }))
           } else {
-            fs.writeFileSync(join(nuxt.options.buildDir, 'components-chunk.mjs'), `export const paths = ${JSON.stringify(
+            writeFileSync(join(nuxt.options.buildDir, 'components-chunk.mjs'), `export const paths = ${JSON.stringify(
               getComponents().filter(c => c.mode === 'client' || c.mode === 'all').reduce((acc, c) => {
                 if (c.filePath.endsWith('.vue') || c.filePath.endsWith('.js') || c.filePath.endsWith('.ts')) { return Object.assign(acc, { [c.pascalName]: `/@fs/${c.filePath}` }) }
-                const filePath = fs.existsSync(`${c.filePath}.vue`) ? `${c.filePath}.vue` : fs.existsSync(`${c.filePath}.js`) ? `${c.filePath}.js` : `${c.filePath}.ts`
+                const filePath = existsSync(`${c.filePath}.vue`) ? `${c.filePath}.vue` : existsSync(`${c.filePath}.js`) ? `${c.filePath}.js` : `${c.filePath}.ts`
                 return Object.assign(acc, { [c.pascalName]: `/@fs/${filePath}` })
               }, {} as Record<string, string>),
             )}`)
@@ -307,7 +311,7 @@ export default defineNuxtModule<ComponentsOptions>({
               getComponents,
             }))
           } else {
-            fs.writeFileSync(join(nuxt.options.buildDir, 'components-chunk.mjs'), 'export const paths = {}')
+            writeFileSync(join(nuxt.options.buildDir, 'components-chunk.mjs'), 'export const paths = {}')
           }
         }
       })

packages/nuxt/src/components/scan.ts

@@ -126,6 +126,8 @@ export async function scanComponents (dirs: ComponentsDir[], srcDir: string): Pr
         export: 'default',
         // by default, give priority to scanned components
         priority: dir.priority ?? 1,
+        // @ts-expect-error untyped property
+        _scanned: true,
       }
 
       if (typeof dir.extendComponent === 'function') {

packages/nuxt/src/core/nuxt.ts

@@ -104,8 +104,7 @@ async function initNuxt (nuxt: Nuxt) {
 
     const shouldShowPrompt = nuxt.options.dev && hasTTY && !isCI
     if (!shouldShowPrompt) {
-      // eslint-disable-next-line no-console
+      logger.info(`Using \`${fallbackCompatibilityDate}\` as fallback compatibility date.`)
-      console.log(`Using \`${fallbackCompatibilityDate}\` as fallback compatibility date.`)
     }
 
     async function promptAndUpdate () {
@@ -114,8 +113,7 @@ async function initNuxt (nuxt: Nuxt) {
         default: true,
       })
       if (result !== true) {
-        // eslint-disable-next-line no-console
+        logger.info(`Using \`${fallbackCompatibilityDate}\` as fallback compatibility date.`)
-        console.log(`Using \`${fallbackCompatibilityDate}\` as fallback compatibility date.`)
         return
       }
 
@@ -149,8 +147,7 @@ async function initNuxt (nuxt: Nuxt) {
         consola.error(`Failed to update config: ${message}`)
       }
 
-      // eslint-disable-next-line no-console
+      logger.info(`Using \`${fallbackCompatibilityDate}\` as fallback compatibility date.`)
-      console.log(`Using \`${fallbackCompatibilityDate}\` as fallback compatibility date.`)
     }
 
     nuxt.hooks.hookOnce('nitro:init', (nitro) => {
@@ -159,8 +156,7 @@ async function initNuxt (nuxt: Nuxt) {
       nitro.hooks.hookOnce('compiled', () => {
         warnedAboutCompatDate = true
         // Print warning
-        // eslint-disable-next-line no-console
+        logger.info(`Nuxt now supports pinning the behavior of provider and deployment presets with a compatibility date. We recommend you specify a \`compatibilityDate\` in your \`nuxt.config\` file, or set an environment variable, such as \`COMPATIBILITY_DATE=${todaysDate}\`.`)
-        console.info(`Nuxt now supports pinning the behavior of provider and deployment presets with a compatibility date. We recommend you specify a \`compatibilityDate\` in your \`nuxt.config\` file, or set an environment variable, such as \`COMPATIBILITY_DATE=${todaysDate}\`.`)
         if (shouldShowPrompt) { promptAndUpdate() }
       })
     })
@@ -674,8 +670,7 @@ async function initNuxt (nuxt: Nuxt) {
   // Show compatibility version banner when Nuxt is running with a compatibility version
   // that is different from the current major version
   if (!(satisfies(nuxt._version, nuxt.options.future.compatibilityVersion + '.x'))) {
-    // eslint-disable-next-line no-console
+    logger.info(`Running with compatibility version \`${nuxt.options.future.compatibilityVersion}\``)
-    console.info(`Running with compatibility version \`${nuxt.options.future.compatibilityVersion}\``)
   }
 
   await nuxt.callHook('ready', nuxt)

packages/nuxt/src/core/runtime/nitro/cache-driver.js

@@ -20,8 +20,8 @@ export default defineDriver((opts) => {
     ...fs, // fall back to file system - only the bottom three methods are used in renderer
     async setItem (key, value, opts) {
       await Promise.all([
-        fs.setItem(normalizeFsKey(key), value, opts),
+        fs.setItem?.(normalizeFsKey(key), value, opts),
-        lru.setItem(key, value, opts),
+        lru.setItem?.(key, value, opts),
       ])
     },
     async hasItem (key, opts) {

packages/nuxt/src/core/runtime/nitro/renderer.ts

@@ -158,9 +158,7 @@ const getSPARenderer = lazyCachedFunction(async () => {
   const renderToString = (ssrContext: NuxtSSRContext) => {
     const config = useRuntimeConfig(ssrContext.event)
     ssrContext.modules = ssrContext.modules || new Set<string>()
-    ssrContext!.payload = {
+    ssrContext.payload.serverRendered = false
-      serverRendered: false,
-    }
     ssrContext.config = {
       public: config.public,
       app: config.app,

packages/nuxt/src/pages/runtime/plugins/router.ts

@@ -122,6 +122,7 @@ const plugin: Plugin<{ router: Router }> = defineNuxtPlugin({
     for (const key in _route.value) {
       Object.defineProperty(route, key, {
         get: () => _route.value[key as keyof RouteLocation],
+        enumerable: true,
       })
     }
 

packages/nuxt/test/scan-components.test.ts

@@ -241,6 +241,8 @@ it('components:scanComponents', async () => {
   for (const c of scannedComponents) {
     // @ts-expect-error filePath is not optional but we don't want it to be in the snapshot
     delete c.filePath
+    // @ts-expect-error _scanned is added internally but we don't want it to be in the snapshot
+    delete c._scanned
   }
   expect(scannedComponents).deep.eq(expectedComponents)
 })

packages/schema/package.json

@@ -42,9 +42,9 @@
     "@unhead/schema": "1.10.4",
     "@vitejs/plugin-vue": "5.1.3",
     "@vitejs/plugin-vue-jsx": "4.0.1",
-    "@vue/compiler-core": "3.5.0",
+    "@vue/compiler-core": "3.5.2",
-    "@vue/compiler-sfc": "3.5.0",
+    "@vue/compiler-sfc": "3.5.2",
-    "@vue/language-core": "2.1.4",
+    "@vue/language-core": "2.1.6",
     "c12": "2.0.0-beta.2",
     "esbuild-loader": "4.2.2",
     "h3": "npm:h3-nightly@2.0.0-1718872656.6765a6e",
@@ -55,7 +55,7 @@
     "unctx": "2.3.1",
     "unenv": "1.10.0",
     "vite": "5.4.3",
-    "vue": "3.5.0",
+    "vue": "3.5.2",
     "vue-bundle-renderer": "2.1.0",
     "vue-loader": "17.4.2",
     "vue-router": "4.4.3",

packages/schema/src/config/app.ts

@@ -31,11 +31,10 @@ export default defineUntypedSchema({
     },
 
     /**
-     * Vue Experimental: Enable reactive destructure for `defineProps`
+     * Enable reactive destructure for `defineProps`
-     * @see [Vue RFC#502](https://github.com/vuejs/rfcs/discussions/502)
      * @type {boolean}
      */
-    propsDestructure: false,
+    propsDestructure: true,
   },
 
   /**

packages/vite/package.json

@@ -29,7 +29,7 @@
     "@types/estree": "1.0.5",
     "rollup": "4.21.2",
     "unbuild": "3.0.0-rc.7",
-    "vue": "3.5.0"
+    "vue": "3.5.2"
   },
   "dependencies": {
     "@nuxt/kit": "workspace:*",
@@ -39,7 +39,7 @@
     "autoprefixer": "^10.4.20",
     "clear": "^0.1.0",
     "consola": "^3.2.3",
-    "cssnano": "^7.0.5",
+    "cssnano": "^7.0.6",
     "defu": "^6.1.4",
     "esbuild": "^0.23.1",
     "escape-string-regexp": "^5.0.0",
@@ -55,13 +55,13 @@
     "pathe": "^1.1.2",
     "perfect-debounce": "^1.0.0",
     "pkg-types": "^1.2.0",
-    "postcss": "^8.4.44",
+    "postcss": "^8.4.45",
     "rollup-plugin-visualizer": "^5.12.0",
     "std-env": "^3.7.0",
     "strip-literal": "^2.1.0",
     "ufo": "^1.5.4",
     "unenv": "^1.10.0",
-    "unplugin": "^1.12.3",
+    "unplugin": "^1.13.1",
     "vite": "^5.4.3",
     "vite-node": "^2.0.5",
     "vite-plugin-checker": "^0.7.2",

packages/webpack/package.json

@@ -30,7 +30,7 @@
     "autoprefixer": "^10.4.20",
     "css-loader": "^7.1.2",
     "css-minimizer-webpack-plugin": "^7.0.0",
-    "cssnano": "^7.0.5",
+    "cssnano": "^7.0.6",
     "defu": "^6.1.4",
     "esbuild-loader": "^4.2.2",
     "escape-string-regexp": "^5.0.0",
@@ -50,7 +50,7 @@
     "ohash": "^1.1.3",
     "pathe": "^1.1.2",
     "pify": "^6.1.0",
-    "postcss": "^8.4.44",
+    "postcss": "^8.4.45",
     "postcss-import": "^16.1.0",
     "postcss-import-resolver": "^2.0.0",
     "postcss-loader": "^8.1.1",
@@ -60,7 +60,7 @@
     "time-fix-plugin": "^2.0.7",
     "ufo": "^1.5.4",
     "unenv": "^1.10.0",
-    "unplugin": "^1.12.3",
+    "unplugin": "^1.13.1",
     "url-loader": "^4.1.1",
     "vue-bundle-renderer": "^2.1.0",
     "vue-loader": "^17.4.2",
@@ -80,7 +80,7 @@
     "@types/webpack-hot-middleware": "2.25.9",
     "rollup": "4.21.2",
     "unbuild": "3.0.0-rc.7",
-    "vue": "3.5.0"
+    "vue": "3.5.2"
   },
   "peerDependencies": {
     "vue": "^3.3.4"

test/bundle.test.ts

@@ -32,10 +32,10 @@ describe.skipIf(process.env.SKIP_BUNDLE_SIZE === 'true' || process.env.ECOSYSTEM
     const serverDir = join(rootDir, '.output/server')
 
     const serverStats = await analyzeSizes(['**/*.mjs', '!node_modules'], serverDir)
-    expect.soft(roundToKilobytes(serverStats.totalBytes)).toMatchInlineSnapshot(`"205k"`)
+    expect.soft(roundToKilobytes(serverStats.totalBytes)).toMatchInlineSnapshot(`"206k"`)
 
     const modules = await analyzeSizes(['node_modules/**/*'], serverDir)
-    expect.soft(roundToKilobytes(modules.totalBytes)).toMatchInlineSnapshot(`"1382k"`)
+    expect.soft(roundToKilobytes(modules.totalBytes)).toMatchInlineSnapshot(`"1383k"`)
 
     const packages = modules.files
       .filter(m => m.endsWith('package.json'))
@@ -73,7 +73,7 @@ describe.skipIf(process.env.SKIP_BUNDLE_SIZE === 'true' || process.env.ECOSYSTEM
     const serverDir = join(rootDir, '.output-inline/server')
 
     const serverStats = await analyzeSizes(['**/*.mjs', '!node_modules'], serverDir)
-    expect.soft(roundToKilobytes(serverStats.totalBytes)).toMatchInlineSnapshot(`"551k"`)
+    expect.soft(roundToKilobytes(serverStats.totalBytes)).toMatchInlineSnapshot(`"553k"`)
 
     const modules = await analyzeSizes(['node_modules/**/*'], serverDir)
     expect.soft(roundToKilobytes(modules.totalBytes)).toMatchInlineSnapshot(`"86.9k"`)