Merge branch 'main' into docs/getting-started/deployment

nuxt · Sep 26, 2022 · 4f20c3b · 4f20c3b
2 parents 458664b + 2e080c2
commit 4f20c3b
Show file tree

Hide file tree

Showing 18 changed files with 383 additions and 44 deletions.
diff --git a/docs/content/2.guide/2.directory-structure/1.server.md b/docs/content/2.guide/2.directory-structure/1.server.md
@@ -66,6 +66,21 @@ export default defineEventHandler((event) => {
 })
 ```
 
+## Server Plugins
+
+Nuxt will automatically read any files in the `~/server/plugins` directory and register them as Nitro plugins. This allows extending Nitro's runtime behavior and hooking into lifecycle events.
+
+**Example:**
+
+```ts [server/plugins/nitroPlugin.ts]
+export default defineNitroPlugin((nitroApp) => {
+  console.log('Nitro plugin', nitroApp)
+})
+```
+
+::ReadMore{link="https://nitro.unjs.io/guide/advanced/plugins" title="Nitro Plugins"}
+::
+
 ## Server Utilities
 
 Server routes are powered by [unjs/h3](https://github.com/unjs/h3) which comes with a handy set of helpers.

diff --git a/docs/content/2.guide/4.going-further/2.hooks.md b/docs/content/2.guide/4.going-further/2.hooks.md
@@ -45,3 +45,26 @@ export default defineNuxtPlugin((nuxtApp) => {
 ::alert{icon=👉}
 Learn more about  [available lifecycle hooks](/api/advanced/hooks)
 ::
+
+## Nitro App Hooks (Runtime)
+
+These hooks are available for [Nitro plugins](https://nitro.unjs.io/guide/advanced/plugins) to hook into Nitro's runtime behavior.
+
+### Usage within a Nitro Plugin
+
+```js [~/server/plugins/test.ts]
+export default defineNitroPlugin((nitroApp) => {
+  nitroApp.hooks.hook('render:html', (html, { event }) => {
+    console.log('render:html', html)
+    html.bodyAppend.push('<hr>Appended by custom plugin')
+  })
+
+  nitroApp.hooks.hook('render:response', (response, { event }) => {
+    console.log('render:response', response)
+  })
+})
+```
+
+::alert{icon=👉}
+Learn more about available [Nitro lifecycle hooks](/api/advanced/hooks#nitro-hooks-runtime-server-side).
+::
diff --git a/docs/content/3.api/4.advanced/1.hooks.md b/docs/content/3.api/4.advanced/1.hooks.md
@@ -28,3 +28,10 @@ Hook                   | Arguments           | Environment     | Description
 Check the [schema source code](https://github.com/nuxt/framework/blob/main/packages/schema/src/types/hooks.ts#L55) for all available hooks.
 
 :NeedContribution
+
+# Nitro App Hooks (runtime, server-side)
+
+Hook                   | Arguments             | Description                          | Types
+-----------------------|-----------------------|--------------------------------------|------------------
+`render:response`      | `response, { event }` | Called before sending the response.  | [response](https://github.com/nuxt/framework/blob/71ef8bd3ff207fd51c2ca18d5a8c7140476780c7/packages/nuxt/src/core/runtime/nitro/renderer.ts#L24), [event](https://github.com/unjs/h3/blob/f6ceb5581043dc4d8b6eab91e9be4531e0c30f8e/src/types.ts#L38)
+`render:html`          | `html, { event }`     | Called before constructing the HTML. | [html](https://github.com/nuxt/framework/blob/71ef8bd3ff207fd51c2ca18d5a8c7140476780c7/packages/nuxt/src/core/runtime/nitro/renderer.ts#L15), [event](https://github.com/unjs/h3/blob/f6ceb5581043dc4d8b6eab91e9be4531e0c30f8e/src/types.ts#L38)
diff --git a/docs/content/3.api/5.commands/build.md b/docs/content/3.api/5.commands/build.md
@@ -1,14 +1,15 @@
 # `nuxi build`
 
 ```{bash}
-npx nuxi build [rootDir]
+npx nuxi build [rootDir] [--prerender] [--dotenv]
 ```
 
 The `build` command creates a `.output` directory with all your application, server and dependencies ready for production.
 
 Option        | Default          | Description
 -------------------------|-----------------|------------------
 `rootDir` | `.` | The root directory of the application to bundle.
-`prerender` | `false` | Pre-render every route of your application. (**note:** This is an experimental flag. The behavior might be changed.)
+`--prerender` | `false` | Pre-render every route of your application. (**note:** This is an experimental flag. The behavior might be changed.)
+`--dotenv` | `.` | Point to another `.env` file to load, **relative** to the root directory.
 
 This command sets `process.env.NODE_ENV` to `production`.
diff --git a/docs/content/3.api/5.commands/dev.md b/docs/content/3.api/5.commands/dev.md
@@ -1,14 +1,15 @@
 # `nuxi dev`
 
 ```{bash}
-npx nuxi dev [rootDir] [--clipboard] [--open, -o] [--no-clear] [--port, -p] [--host, -h] [--https] [--ssl-cert] [--ssl-key]
+npx nuxi dev [rootDir] [--dotenv] [--clipboard] [--open, -o] [--no-clear] [--port, -p] [--host, -h] [--https] [--ssl-cert] [--ssl-key]
 ```
 
 The `dev` command starts a development server with hot module replacement at [http://localhost:3000](https://localhost:3000)
 
 Option        | Default          | Description
 -------------------------|-----------------|------------------
 `rootDir` | `.` | The root directory of the application to serve.
+`--dotenv` | `.` | Point to another `.env` file to load, **relative** to the root directory.
 `--clipboard` | `false` | Copy URL to clipboard.
 `--open, -o` | `false` | Open URL in browser.
 `--no-clear` | `false` | Does not clear the console after startup.

diff --git a/docs/content/3.api/5.commands/preview.md b/docs/content/3.api/5.commands/preview.md
@@ -1,14 +1,15 @@
 # `nuxi preview`
 
 ```{bash}
-npx nuxi preview [rootDir]
+npx nuxi preview [rootDir] [--dotenv]
 ```
 
 The `preview` command starts a server to preview your Nuxt application after running the `build` command.
 
 Option        | Default          | Description
 -------------------------|-----------------|------------------
 `rootDir` | `.` | The root directory of the application to preview.
+`--dotenv` | `.` | Point to another `.env` file to load, **relative** to the root directory.
 
 This command sets `process.env.NODE_ENV` to `production`. To override, define `NODE_ENV` in a `.env` file or as command-line argument.
 

diff --git a/docs/content/5.community/5.roadmap.md b/docs/content/5.community/5.roadmap.md
@@ -18,8 +18,8 @@ Nuxt is constantly evolving, with new features and modules being added all the t
 
 Release             | Expected date   | Description
 --------------------|-----------------|---------------------------------------------------
-`nuxt@2.16`         | Summer,  2022   | Nuxt v2 cumulative updates for future compatibility with Bridge
-`nuxt@3.0.0`        | Summer,  2022   | Nuxt v3 stable release
+`nuxt@2.16`         | Autumn,  2022   | Nuxt v2 cumulative updates for future compatibility with Bridge
+`nuxt@3.0.0`        | Autumn,  2022   | Nuxt v3 final release
 
 ### Current Releases
 
@@ -61,6 +61,6 @@ Module         | Status              | Nuxt Support | Repository | Description
 ---------------|---------------------|--------------|------------|-------------------
 Content 1.x    | Maintenance         | 2.x          | [nuxt/content](https://github.com/nuxt/content/tree/v1) | Maintenance only
 Content 2.x    | Active              | 3.x          | [nuxt/content](https://github.com/nuxt/content) | Released
-Auth           | WIP                 | 3.x          | [nuxt/auth](https://github.com/nuxt/auth) | Nuxt 3 support is planned after session support
+Auth           | WIP                 | 3.x          | `nuxt/auth` to be announced | Nuxt 3 support is planned after session support
 Image          | Active              | 2.x and 3.x  | [nuxt/image](https://github.com/nuxt/image) | Nuxt 3 support is in progress: [nuxt/image#548](https://github.com/nuxt/image/discussions/548)
 Telemetry      | Active              | 2.x and 3.x  | [nuxt/telemetry](https://github.com/nuxt/telemetry/) | Nuxt 3 is supported. Stats to be public soon!
diff --git a/docs/content/bridge/1.overview.md b/docs/content/bridge/1.overview.md
@@ -149,6 +149,36 @@ Overwriting options such as `"compilerOptions.paths"` with your own configuratio
 In case you need to extend options provided by `./.nuxt/tsconfig.json` further, you can use the `alias` property withing your `nuxt.config`. `nuxi` will pick them up and extend `./.nuxt/tsconfig.json` accordingly.
 ::
 
+## Update Runtime Config
+
+Nuxt 3 approaches runtime config differently than Nuxt 2, using a new combined `runtimeConfig` option.
+
+First, you'll need to combine your `publicRuntimeConfig` and `privateRuntimeConfig` properties into a new one called `runtimeConfig`, with the public config within a key called `public`.
+
+```diff
+// nuxt.config.js
+- privateRuntimeConfig: {
+-   apiKey: process.env.NUXT_API_KEY || 'super-secret-key'
+- },
+- publicRuntimeConfig: {
+-   websiteURL: 'https://public-data.com'
+- }
++ runtimeConfig: {
++   apiKey: process.env.NUXT_API_KEY || 'super-secret-key',
++   public: {
++     websiteURL: 'https://public-data.com'
++   }
++ }
+```
+
+This also means that when you need to access public runtime config, it's behind a property called `public`. If you use public runtime config, you'll need to update your code.
+
+```diff
+// MyWidget.vue
+- <div>Website: {{ $config.websiteURL }}</div>
++ <div>Website: {{ $config.public.websiteURL }}</div>
+```
+
 ## Migrate Composition API
 
 If you were using `@vue/composition-api` or `@nuxtjs/composition-api`, please read the [composition api migration guide](/bridge/bridge-composition-api).

diff --git a/package.json b/package.json
@@ -50,13 +50,13 @@
     "@actions/core": "^1.9.1",
     "@nuxtjs/eslint-config-typescript": "^11.0.0",
     "@types/crawler": "^1.2.2",
-    "@types/node": "^16.11.59",
+    "@types/node": "^16.11.60",
     "@types/rimraf": "^3",
-    "@unocss/reset": "^0.45.22",
+    "@unocss/reset": "^0.45.23",
     "case-police": "^0.5.10",
     "changelogen": "^0.3.2",
     "crawler": "^1.3.0",
-    "eslint": "^8.23.1",
+    "eslint": "^8.24.0",
     "eslint-plugin-jsdoc": "^39.3.6",
     "execa": "^6.1.0",
     "expect-type": "^0.14.2",

diff --git a/packages/nuxi/src/commands/build.ts b/packages/nuxi/src/commands/build.ts
@@ -10,7 +10,7 @@ import { defineNuxtCommand } from './index'
 export default defineNuxtCommand({
   meta: {
     name: 'build',
-    usage: 'npx nuxi build [--prerender] [rootDir]',
+    usage: 'npx nuxi build [--prerender] [--dotenv] [rootDir]',
     description: 'Build nuxt for production deployment'
   },
   async invoke (args) {
@@ -23,6 +23,10 @@ export default defineNuxtCommand({
 
     const nuxt = await loadNuxt({
       rootDir,
+      dotenv: {
+        cwd: rootDir,
+        fileName: args.dotenv
+      },
       overrides: {
         _generate: args.prerender
       }

diff --git a/packages/nuxi/src/commands/dev.ts b/packages/nuxi/src/commands/dev.ts
@@ -18,7 +18,7 @@ import { defineNuxtCommand } from './index'
 export default defineNuxtCommand({
   meta: {
     name: 'dev',
-    usage: 'npx nuxi dev [rootDir] [--clipboard] [--open, -o] [--port, -p] [--host, -h] [--https] [--ssl-cert] [--ssl-key]',
+    usage: 'npx nuxi dev [rootDir] [--dotenv] [--clipboard] [--open, -o] [--port, -p] [--host, -h] [--https] [--ssl-cert] [--ssl-key]',
     description: 'Run nuxt development server'
   },
   async invoke (args) {
@@ -40,7 +40,7 @@ export default defineNuxtCommand({
     const rootDir = resolve(args._[0] || '.')
     showVersions(rootDir)
 
-    await setupDotenv({ cwd: rootDir })
+    await setupDotenv({ cwd: rootDir, fileName: args.dotenv })
 
     const listener = await listen(serverHandler, {
       showURL: false,

diff --git a/packages/nuxi/src/commands/preview.ts b/packages/nuxi/src/commands/preview.ts
@@ -10,7 +10,7 @@ import { defineNuxtCommand } from './index'
 export default defineNuxtCommand({
   meta: {
     name: 'preview',
-    usage: 'npx nuxi preview|start [rootDir]',
+    usage: 'npx nuxi preview|start [--dotenv] [rootDir]',
     description: 'Launches nitro server for local testing after `nuxi build`.'
   },
   async invoke (args) {
@@ -35,9 +35,10 @@ export default defineNuxtCommand({
       process.exit(1)
     }
 
-    if (existsSync(resolve(rootDir, '.env'))) {
+    const envExists = args.dotenv ? existsSync(resolve(rootDir, args.dotenv)) : existsSync(rootDir)
+    if (envExists) {
       consola.info('Loading `.env`. This will not be loaded when running the server in production.')
-      await setupDotenv({ cwd: rootDir })
+      await setupDotenv({ cwd: rootDir, fileName: args.dotenv })
     }
 
     consola.info('Starting preview command:', nitroJSON.commands.preview)

diff --git a/packages/nuxt/src/app/components/layout.ts b/packages/nuxt/src/app/components/layout.ts
@@ -1,4 +1,4 @@
-import { defineComponent, isRef, nextTick, onMounted, Ref, Transition, VNode } from 'vue'
+import { defineComponent, unref, nextTick, onMounted, Ref, Transition, VNode } from 'vue'
 import { _wrapIf } from './utils'
 import { useRoute } from '#app'
 // @ts-ignore
@@ -29,7 +29,7 @@ export default defineComponent({
     }
 
     return () => {
-      const layout = (isRef(props.name) ? props.name.value : props.name) ?? route.meta.layout as string ?? 'default'
+      const layout = unref(props.name) ?? route.meta.layout as string ?? 'default'
 
       const hasLayout = layout && layout in layouts
       if (process.dev && layout && !hasLayout && layout !== 'default') {

diff --git a/packages/nuxt/src/app/composables/fetch.ts b/packages/nuxt/src/app/composables/fetch.ts
@@ -1,6 +1,6 @@
 import type { FetchError, FetchOptions } from 'ohmyfetch'
 import type { TypedInternalResponse, NitroFetchRequest } from 'nitropack'
-import { computed, isRef, Ref } from 'vue'
+import { computed, unref, Ref } from 'vue'
 import type { AsyncDataOptions, _Transform, KeyOfRes, AsyncData, PickFrom } from './asyncData'
 import { useAsyncData } from './asyncData'
 
@@ -52,7 +52,7 @@ export function useFetch<
     if (typeof r === 'function') {
       r = r()
     }
-    return (isRef(r) ? r.value : r)
+    return unref(r)
   })
 
   const {

diff --git a/packages/nuxt/src/core/nitro.ts b/packages/nuxt/src/core/nitro.ts
@@ -99,7 +99,7 @@ export async function initNitro (nuxt: Nuxt & { _nitro?: Nitro }) {
     },
     replace: {
       'process.env.NUXT_NO_SSR': nuxt.options.ssr === false,
-      'process.env.NUXT_NO_SCRIPTS': !!nuxt.options.experimental.noScripts,
+      'process.env.NUXT_NO_SCRIPTS': !!nuxt.options.experimental.noScripts && !nuxt.options.dev,
       'process.env.NUXT_INLINE_STYLES': !!nuxt.options.experimental.inlineSSRStyles,
       'process.env.NUXT_PAYLOAD_EXTRACTION': !!nuxt.options.experimental.payloadExtraction,
       'process.dev': nuxt.options.dev,

diff --git a/packages/nuxt/src/core/runtime/nitro/renderer.ts b/packages/nuxt/src/core/runtime/nitro/renderer.ts
@@ -143,7 +143,7 @@ export default defineRenderHandler(async (event) => {
 
   // Whether we are prerendering route
   const _PAYLOAD_EXTRACTION = process.env.prerender && process.env.NUXT_PAYLOAD_EXTRACTION && !ssrContext.noSSR
-  const payloadURL = _PAYLOAD_EXTRACTION ? joinURL(url, '_payload.js') : undefined
+  const payloadURL = _PAYLOAD_EXTRACTION ? joinURL(useRuntimeConfig().app.baseURL, url, '_payload.js') : undefined
   if (process.env.prerender) {
     ssrContext.payload.prerenderedAt = Date.now()
   }
@@ -177,7 +177,7 @@ export default defineRenderHandler(async (event) => {
 
   if (_PAYLOAD_EXTRACTION) {
     // Hint nitro to prerender payload for this route
-    appendHeader(event, 'x-nitro-prerender', payloadURL!)
+    appendHeader(event, 'x-nitro-prerender', joinURL(url, '_payload.js'))
     // Use same ssr context to generate payload for this route
     PAYLOAD_CACHE!.set(url, renderPayloadResponse(ssrContext))
   }

diff --git a/packages/vite/package.json b/packages/vite/package.json
@@ -27,7 +27,7 @@
     "chokidar": "^3.5.3",
     "cssnano": "^5.1.13",
     "defu": "^6.1.0",
-    "esbuild": "^0.15.8",
+    "esbuild": "^0.15.9",
     "escape-string-regexp": "^5.0.0",
     "estree-walker": "^3.0.1",
     "externality": "^0.2.2",
@@ -45,7 +45,7 @@
     "postcss-import": "^15.0.0",
     "postcss-url": "^10.1.3",
     "rollup": "^2.79.1",
-    "rollup-plugin-visualizer": "^5.8.1",
+    "rollup-plugin-visualizer": "^5.8.2",
     "ufo": "^0.8.5",
     "unplugin": "^0.9.2",
     "vite": "~3.1.3",