Skip to content
This repository has been archived by the owner on Apr 6, 2023. It is now read-only.

feat: allow customizing root id and tag #8883

Merged
merged 1 commit into from Nov 10, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
4 changes: 3 additions & 1 deletion packages/nuxt/src/app/entry.ts
Expand Up @@ -9,6 +9,8 @@ import '#build/css'
import _plugins from '#build/plugins'
// @ts-ignore
import RootComponent from '#build/root-component.mjs'
// @ts-ignore
import { appRootId } from '#build/nuxt.config.mjs'

if (!globalThis.$fetch) {
// @ts-ignore
Expand Down Expand Up @@ -64,7 +66,7 @@ if (process.client) {
try {
await nuxt.hooks.callHook('app:created', vueApp)
await nuxt.hooks.callHook('app:beforeMount', vueApp)
vueApp.mount('#__nuxt')
vueApp.mount('#' + appRootId)
await nuxt.hooks.callHook('app:mounted', vueApp)
await nextTick()
} catch (err) {
Expand Down
4 changes: 3 additions & 1 deletion packages/nuxt/src/core/nitro.ts
Expand Up @@ -33,7 +33,9 @@ export async function initNitro (nuxt: Nuxt & { _nitro?: Nitro }) {
handlers: nuxt.options.serverHandlers,
devHandlers: [],
baseURL: nuxt.options.app.baseURL,
virtual: {},
virtual: {
'#internal/nuxt.config.mjs': () => nuxt.vfs['#build/nuxt.config']
},
routeRules: {
'/__nuxt_error': { cache: false }
},
Expand Down
7 changes: 4 additions & 3 deletions packages/nuxt/src/core/runtime/nitro/renderer.ts
Expand Up @@ -8,7 +8,8 @@ import { renderToString as _renderToString } from 'vue/server-renderer'
import { useRuntimeConfig, useNitroApp, defineRenderHandler, getRouteRules } from '#internal/nitro'
// eslint-disable-next-line import/no-restricted-paths
import type { NuxtApp, NuxtSSRContext } from '#app'

// @ts-ignore
import { appRootId, appRootTag } from '#internal/nuxt.config.mjs'
// @ts-ignore
import { buildAssetsURL, publicAssetsURL } from '#paths'

Expand Down Expand Up @@ -71,7 +72,7 @@ const getSSRRenderer = lazyCachedFunction(async () => {
if (process.dev && process.env.NUXT_VITE_NODE_OPTIONS) {
renderer.rendererContext.updateManifest(await getClientManifest())
}
return `<div id="__nuxt">${html}</div>`
return `<${appRootTag} id="${appRootId}">${html}</${appRootTag}>`
}

return renderer
Expand All @@ -83,7 +84,7 @@ const getSPARenderer = lazyCachedFunction(async () => {

const options = {
manifest,
renderToString: () => '<div id="__nuxt"></div>',
renderToString: () => `<${appRootTag} id="${appRootId}"></${appRootTag}>`,
buildAssetsURL
}
// Create SPA renderer and cache the result for all requests
Expand Down
11 changes: 11 additions & 0 deletions packages/schema/src/config/app.ts
Expand Up @@ -143,6 +143,17 @@ export default defineUntypedSchema({
* @type {typeof import('../src/types/config').NuxtAppConfig['keepalive']}
*/
keepalive: false,

/**
* Customize Nuxt root element id.
*/
rootId: '__nuxt',

/**
* Customize Nuxt root element tag.
*
*/
rootTag: 'div',
},

/**
Expand Down