feat: support document.html

packages/nuxt3/src/builder/builder.ts

@@ -3,6 +3,7 @@ import fsExtra from 'fs-extra'
 import { debounce } from 'lodash'
 import { BundleBuilder } from 'src/webpack'
 import { Nuxt } from '../core'
+import { DeterminedGlobals, determineGlobals } from '../utils'
 import {
   templateData,
   compileTemplates,
@@ -15,12 +16,14 @@ import Ignore from './ignore'
 
 export class Builder {
   nuxt: Nuxt
+  globals: DeterminedGlobals
   ignore: Ignore
-  app: NuxtApp
   templates: NuxtTemplate[]
+  app: NuxtApp
 
   constructor (nuxt) {
     this.nuxt = nuxt
+    this.globals = determineGlobals(nuxt.options.globalName, nuxt.options.globals)
     this.ignore = new Ignore({
       rootDir: nuxt.options.srcDir,
       ignoreArray: nuxt.options.ignore.concat(
@@ -32,6 +35,10 @@ export class Builder {
   build () {
     return build(this)
   }
+
+  close () {
+    // TODO: close watchers
+  }
 }
 
 // Extends VueRouter

packages/nuxt3/src/builder/template.ts

@@ -11,6 +11,7 @@ export interface NuxtTemplate {
 
 export function templateData (builder) {
   return {
+    globals: builder.globals,
     app: builder.app
   }
 }

packages/nuxt3/src/builder/watch.ts

@@ -38,7 +38,8 @@ export function createWatcher (
   return {
     watchAll,
     watch,
-    debug
+    debug,
+    close: () => watcher.close()
   }
 }
 

packages/nuxt3/src/config/options.ts

@@ -12,7 +12,7 @@ import { DefaultConfiguration, defaultNuxtConfigFile, getDefaultNuxtConfig } fro
 import { deleteProp, mergeConfigs, setProp, overrideProp, Optional } from './transformers'
 
 interface InputConfiguration {
-  appTemplatePath?: string
+  documentPath?: string
   layoutTransition?: string | DefaultConfiguration['layoutTransition']
   loading?: true | false | DefaultConfiguration['loading']
   manifest?: {
@@ -197,13 +197,16 @@ function normalizeConfig (_options: CliConfiguration) {
     .concat(options.extensions))
 
   // If app.html is defined, set the template path to the user template
-  if (options.appTemplatePath === undefined) {
+  if (options.documentPath === undefined) {
-    options.appTemplatePath = path.resolve(options.buildDir, 'views/app.template.html')
+    options.documentPath = path.resolve(options.buildDir, 'views/document.template.html')
-    if (fs.existsSync(path.join(options.srcDir, 'app.html'))) {
+    const userDocumentPath = path.join(options.srcDir, 'document.html')
-      options.appTemplatePath = path.join(options.srcDir, 'app.html')
+    if (fs.existsSync(userDocumentPath)) {
+      options.documentPath = userDocumentPath
+    } else {
+      options.watch.push(userDocumentPath)
     }
   } else {
-    options.appTemplatePath = path.resolve(options.srcDir, options.appTemplatePath)
+    options.documentPath = path.resolve(options.srcDir, options.documentPath)
   }
 
   overrideProp(options.build, 'publicPath', options.build.publicPath.replace(/([^/])$/, '$1/'))

packages/nuxt3/src/vue-renderer/renderers/ssr.ts

@@ -96,6 +96,9 @@ export default class SSRRenderer extends BaseRenderer {
     // Call Vue renderer renderToString
     let APP = await this.vueRenderer.renderToString(renderContext)
 
+    // Wrap with Nuxt id
+    APP = `<div id="${this.serverContext.globals.id}">${APP}</div>`
+
     // Call render:done in app
     await renderContext.nuxt.hooks.callHook('vue-renderer:done')
 

packages/nuxt3/src/webpack/configs/client.ts

@@ -94,7 +94,7 @@ function clientHTML (ctx: WebpackConfigContext) {
     config.plugins.push(
       new HTMLPlugin({
         filename: '../server/index.ssr.html',
-        template: options.appTemplatePath,
+        template: options.documentPath,
         minify: options.build.html.minify as any,
         inject: false // Resources will be injected using bundleRenderer
       })
@@ -104,7 +104,7 @@ function clientHTML (ctx: WebpackConfigContext) {
   config.plugins.push(
     new HTMLPlugin({
       filename: '../server/index.spa.html',
-      template: options.appTemplatePath,
+      template: options.documentPath,
       minify: options.build.html.minify as any,
       inject: true
     })