Merge branch 'main' into fix/server_component_no_injectStyles

.github/workflows/autofix-docs.yml

@@ -5,6 +5,8 @@ on:
     paths:
       - "docs/**"
       - ".github/workflows/docs.yml"
+    branches:
+      - "renovate/**"
 
 permissions:
   contents: read

.github/workflows/docs.yml

@@ -8,6 +8,7 @@ on:
     # autofix workflow will be triggered instead for PRs
     branches:
       - main
+      - "renovate/**"
       - "!v[0-9]*"
 
 # Remove default permissions of GITHUB_TOKEN for security

docs/3.api/1.composables/use-fetch.md

@@ -114,7 +114,7 @@ const { data, pending, error, refresh } = await useFetch('/api/auth/login', {
   },
   onResponse({ request, response, options }) {
     // Process the response data
-    return response._data
+    localStorage.setItem('token', response._data.token)
   },
   onResponseError({ request, response, options }) {
     // Handle the response errors

examples/other/use-custom-fetch-composable/composables/useCustomFetch.ts

@@ -15,12 +15,12 @@ export function useCustomFetch<T> (url: string, options: UseFetchOptions<T> = {}
       ? { Authorization: `Bearer ${userAuth.value}` }
       : {},
 
-    onResponse (__ctx) {
-      // return new myBusinessResponse(response._data)
+    onResponse (_ctx) {
+      // _ctx.response._data = new myBusinessResponse(_ctx.response._data)
     },
 
-    onResponseError (__ctx) {
-      // return new myBusinessError(error)
+    onResponseError (_ctx) {
+      // throw new myBusinessError()
     }
   }
 

packages/nuxt/src/app/components/utils.ts

@@ -1,22 +1,16 @@
-import { defineComponent, h } from 'vue'
+import { h } from 'vue'
 import type { Component } from 'vue'
 // eslint-disable-next-line
 import { isString, isPromise, isArray } from '@vue/shared'
 
-const Fragment = defineComponent({
-  name: 'FragmentWrapper',
-  setup (_props, { slots }) {
-    return () => slots.default?.()
-  }
-})
-
 /**
  * Internal utility
  *
  * @private
  */
 export const _wrapIf = (component: Component, props: any, slots: any) => {
-  return { default: () => props ? h(component, props === true ? {} : props, slots) : h(Fragment, {}, slots) }
+  props = props === true ? {} : props
+  return { default: () => props ? h(component, props, slots) : slots.default?.() }
 }
 
 // eslint-disable-next-line no-use-before-define

packages/nuxt/src/components/module.ts

@@ -114,14 +114,14 @@ export default defineNuxtModule<ComponentsOptions>({
     })
 
     // components.d.ts
-    addTemplate({ ...componentsTypeTemplate, options: { getComponents } })
+    addTemplate({ ...componentsTypeTemplate })
     // components.plugin.mjs
-    addPluginTemplate({ ...componentsPluginTemplate, options: { getComponents } } as any)
+    addPluginTemplate({ ...componentsPluginTemplate } as any)
     // component-names.mjs
-    addTemplate({ ...componentNamesTemplate, options: { getComponents, mode: 'all' } })
+    addTemplate({ ...componentNamesTemplate, options: { mode: 'all' } })
     // components.islands.mjs
     if (nuxt.options.experimental.componentIslands) {
-      addTemplate({ ...componentsIslandsTemplate, filename: 'components.islands.mjs', options: { getComponents } })
+      addTemplate({ ...componentsIslandsTemplate, filename: 'components.islands.mjs' })
     } else {
       addTemplate({ filename: 'components.islands.mjs', getContents: () => 'export default {}' })
     }
@@ -178,7 +178,7 @@ export default defineNuxtModule<ComponentsOptions>({
     })
 
     // Scan components and add to plugin
-    nuxt.hook('app:templates', async () => {
+    nuxt.hook('app:templates', async (app) => {
       const newComponents = await scanComponents(componentDirs, nuxt.options.srcDir!)
       await nuxt.callHook('components:extend', newComponents)
       // add server placeholder for .client components server side. issue: #7085
@@ -193,6 +193,7 @@ export default defineNuxtModule<ComponentsOptions>({
         }
       }
       context.components = newComponents
+      app.components = newComponents
     })
 
     nuxt.hook('prepare:types', ({ references, tsConfig }) => {

packages/nuxt/src/components/templates.ts

@@ -1,8 +1,9 @@
 import { isAbsolute, relative } from 'pathe'
 import { genDynamicImport } from 'knitwork'
-import type { Component, Nuxt, NuxtPluginTemplate, NuxtTemplate } from 'nuxt/schema'
+import type { Component, Nuxt, NuxtApp, NuxtPluginTemplate, NuxtTemplate } from 'nuxt/schema'
 
 export interface ComponentsTemplateContext {
+  app: NuxtApp
   nuxt: Nuxt
   options: {
     getComponents: (mode?: 'client' | 'server' | 'all') => Component[]
@@ -34,8 +35,8 @@ export default defineNuxtPlugin({
 
 export const componentsPluginTemplate: NuxtPluginTemplate<ComponentsTemplateContext> = {
   filename: 'components.plugin.mjs',
-  getContents ({ options }) {
-    const globalComponents = options.getComponents().filter(c => c.global)
+  getContents ({ app }) {
+    const globalComponents = app.components.filter(c => c.global)
     if (!globalComponents.length) { return emptyComponentsPlugin }
 
     return `import { defineNuxtPlugin } from '#app/nuxt'
@@ -59,15 +60,15 @@ export default defineNuxtPlugin({
 
 export const componentNamesTemplate: NuxtPluginTemplate<ComponentsTemplateContext> = {
   filename: 'component-names.mjs',
-  getContents ({ options }) {
-    return `export const componentNames = ${JSON.stringify(options.getComponents().filter(c => !c.island).map(c => c.pascalName))}`
+  getContents ({ app }) {
+    return `export const componentNames = ${JSON.stringify(app.components.filter(c => !c.island).map(c => c.pascalName))}`
   }
 }
 
 export const componentsIslandsTemplate: NuxtTemplate<ComponentsTemplateContext> = {
   // components.islands.mjs'
-  getContents ({ options }) {
-    const components = options.getComponents()
+  getContents ({ app }) {
+    const components = app.components
     const islands = components.filter(component =>
       component.island ||
       // .server components without a corresponding .client component will need to be rendered as an island
@@ -85,9 +86,9 @@ export const componentsIslandsTemplate: NuxtTemplate<ComponentsTemplateContext>
 
 export const componentsTypeTemplate: NuxtTemplate<ComponentsTemplateContext> = {
   filename: 'components.d.ts',
-  getContents: ({ options, nuxt }) => {
+  getContents: ({ app, nuxt }) => {
     const buildDir = nuxt.options.buildDir
-    const componentTypes = options.getComponents().filter(c => !c.island).map(c => [
+    const componentTypes = app.components.filter(c => !c.island).map(c => [
       c.pascalName,
       `typeof ${genDynamicImport(isAbsolute(c.filePath)
         ? relative(buildDir, c.filePath).replace(/(?<=\w)\.(?!vue)\w+$/g, '')

packages/nuxt/src/core/app.ts

@@ -12,6 +12,7 @@ export function createApp (nuxt: Nuxt, options: Partial<NuxtApp> = {}): NuxtApp
     dir: nuxt.options.srcDir,
     extensions: nuxt.options.extensions,
     plugins: [],
+    components: [],
     templates: []
   } as unknown as NuxtApp) as NuxtApp
 }

packages/nuxt/src/core/nitro.ts

@@ -130,7 +130,7 @@ export async function initNitro (nuxt: Nuxt & { _nitro?: Nitro }) {
       ],
       traceInclude: [
         // force include files used in generated code from the runtime-compiler
-        ...(nuxt.options.experimental.runtimeVueCompiler && !nuxt.options.experimental.externalVue)
+        ...(nuxt.options.vue.runtimeCompiler && !nuxt.options.experimental.externalVue)
           ? [
               ...nuxt.options.modulesDir.reduce<string[]>((targets, path) => {
                 const serverRendererPath = resolve(path, 'vue/server-renderer/index.js')
@@ -150,7 +150,7 @@ export async function initNitro (nuxt: Nuxt & { _nitro?: Nitro }) {
             vue: await resolvePath(`vue/dist/vue.cjs${nuxt.options.dev ? '' : '.prod'}.js`)
           },
       // Vue 3 mocks
-      ...nuxt.options.experimental.runtimeVueCompiler || nuxt.options.experimental.externalVue
+      ...nuxt.options.vue.runtimeCompiler || nuxt.options.experimental.externalVue
         ? {}
         : {
             'estree-walker': 'unenv/runtime/mock/proxy',
@@ -253,7 +253,7 @@ export async function initNitro (nuxt: Nuxt & { _nitro?: Nitro }) {
   })
 
   // Enable runtime compiler client side
-  if (nuxt.options.experimental.runtimeVueCompiler) {
+  if (nuxt.options.vue.runtimeCompiler) {
     nuxt.hook('vite:extendConfig', (config, { isClient }) => {
       if (isClient) {
         if (Array.isArray(config.resolve!.alias)) {

packages/schema/src/config/app.ts

@@ -13,6 +13,13 @@ export default defineUntypedSchema({
      * @type {typeof import('@vue/compiler-core').CompilerOptions}
      */
     compilerOptions: {},
+
+    /**
+     * Include Vue compiler in runtime bundle.
+     */
+    runtimeCompiler: {
+      $resolve: async (val, get) => val ?? await get('experimental.runtimeVueCompiler') ?? false,
+    },
   },
 
   /**

packages/schema/src/config/experimental.ts

@@ -23,12 +23,6 @@ export default defineUntypedSchema({
      */
     externalVue: true,
 
-    // TODO: move to `vue.runtimeCompiler` in v3.5
-    /**
-     * Include Vue compiler in runtime bundle.
-     */
-    runtimeVueCompiler: false,
-
     /**
      * Tree shakes contents of client-only components from server bundle.
      * @see https://github.com/nuxt/framework/pull/5750

packages/schema/src/types/nuxt.ts

@@ -1,6 +1,7 @@
 import type { Hookable } from 'hookable'
 import type { Ignore } from 'ignore'
 import type { NuxtHooks, NuxtLayout, NuxtMiddleware } from './hooks'
+import type { Component } from './components'
 import type { NuxtOptions } from './config'
 
 export interface Nuxt {
@@ -58,6 +59,7 @@ export interface NuxtApp {
   dir: string
   extensions: string[]
   plugins: NuxtPlugin[]
+  components: Component[]
   layouts: Record<string, NuxtLayout>
   middleware: NuxtMiddleware[]
   templates: NuxtTemplate[]

packages/vite/package.json

@@ -30,7 +30,7 @@
     "@vitejs/plugin-vue-jsx": "^3.0.1",
     "autoprefixer": "^10.4.14",
     "clear": "^0.1.0",
-    "cssnano": "^6.0.0",
+    "cssnano": "^6.0.1",
     "defu": "^6.1.2",
     "esbuild": "^0.17.18",
     "escape-string-regexp": "^5.0.0",
@@ -56,7 +56,7 @@
     "unplugin": "^1.3.1",
     "vite": "~4.3.3",
     "vite-node": "^0.30.1",
-    "vite-plugin-checker": "^0.5.6",
+    "vite-plugin-checker": "^0.6.0",
     "vue-bundle-renderer": "^1.0.3"
   },
   "peerDependencies": {

packages/webpack/package.json

@@ -24,7 +24,7 @@
     "autoprefixer": "^10.4.14",
     "css-loader": "^6.7.3",
     "css-minimizer-webpack-plugin": "^5.0.0",
-    "cssnano": "^6.0.0",
+    "cssnano": "^6.0.1",
     "esbuild-loader": "^3.0.1",
     "escape-string-regexp": "^5.0.0",
     "estree-walker": "^3.0.3",