Merge branch 'main' into feat/magic-keys

nuxt · Jul 6, 2022 · 30f2699 · 30f2699
2 parents 9ced5f2 + 00c1dae
commit 30f2699
Show file tree

Hide file tree

Showing 13 changed files with 62 additions and 251 deletions.
diff --git a/docs/content/2.guide/3.directory-structure/11.plugins.md b/docs/content/2.guide/3.directory-structure/11.plugins.md
@@ -122,4 +122,24 @@ export default defineNuxtPlugin((nuxtApp) => {
 })
 ```
 
+## Vue directives
+
+Similarly, you can register a custom Vue directive in a plugin. For example, in `plugins/directive.ts`:
+
+```ts
+export default defineNuxtPlugin((nuxtApp) => {
+  nuxtApp.vueApp.directive('focus', {
+    mounted (el) {
+      el.focus()
+    },
+    getSSRProps (binding, vnode) {
+      // you can provide SSR-specific props here
+      return {}
+    }
+  })
+})
+```
+
+:ReadMore{link="https://vuejs.org/guide/reusability/custom-directives.html"}
+
 :LinkExample{link="/examples/app/plugins"}
diff --git a/docs/content/3.api/5.commands/analyze.md b/docs/content/3.api/5.commands/analyze.md
@@ -11,3 +11,5 @@ The `analyze` command builds Nuxt and analyzes the production bundle (experiment
 Option        | Default          | Description
 -------------------------|-----------------|------------------
 `rootDir` | `.` | The directory of the target application.
+
+This command sets `process.env.NODE_ENV` to `production`.
diff --git a/docs/content/3.api/5.commands/build.md b/docs/content/3.api/5.commands/build.md
@@ -11,4 +11,4 @@ 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.)
 
-This command sets `process.env.NODE_ENV` to `production`. To override, define `NODE_ENV` in a `.env` file or as command-line argument.
+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
@@ -20,4 +20,4 @@ Option        | Default          | Description
 
 The port and host can also be set via NUXT_PORT, PORT, NUXT_HOST or HOST environment variables.
 
-This command sets `process.env.NODE_ENV` to `development`. To override, define `NODE_ENV` in a `.env` file or as command-line argument.
+This command sets `process.env.NODE_ENV` to `development`.
diff --git a/packages/nuxt/src/app/compat/legacy-app.ts b/packages/nuxt/src/app/compat/legacy-app.ts
diff --git a/packages/nuxt/src/app/composables/component.ts b/packages/nuxt/src/app/composables/component.ts
@@ -1,19 +1,18 @@
 import { defineComponent, getCurrentInstance, reactive, toRefs } from 'vue'
 import type { DefineComponent } from 'vue'
 import { useRoute } from 'vue-router'
-import type { LegacyContext } from '../compat/legacy-app'
-import { useNuxtApp } from '../nuxt'
+import { NuxtApp, useNuxtApp } from '../nuxt'
 import { useAsyncData } from './asyncData'
 
 export const NuxtComponentIndicator = '__nuxt_component'
 
-async function runLegacyAsyncData (res: Record<string, any> | Promise<Record<string, any>>, fn: (context: LegacyContext) => Promise<Record<string, any>>) {
+async function runLegacyAsyncData (res: Record<string, any> | Promise<Record<string, any>>, fn: (nuxtApp: NuxtApp) => Promise<Record<string, any>>) {
   const nuxt = useNuxtApp()
   const route = useRoute()
   const vm = getCurrentInstance()
   const { fetchKey } = vm.proxy.$options
   const key = typeof fetchKey === 'function' ? fetchKey(() => '') : fetchKey || route.fullPath
-  const { data } = await useAsyncData(`options:asyncdata:${key}`, () => fn(nuxt._legacyContext))
+  const { data } = await useAsyncData(`options:asyncdata:${key}`, () => fn(nuxt))
   if (data.value && typeof data.value === 'object') {
     Object.assign(await res, toRefs(reactive(data.value)))
   } else if (process.dev) {

diff --git a/packages/nuxt/src/app/composables/fetch.ts b/packages/nuxt/src/app/composables/fetch.ts
@@ -39,7 +39,11 @@ export function useFetch<
   _fallback?: string
 ) {
   const [opts, fallback] = (typeof _opts === 'string' ? [{}, _opts] : [_opts, _fallback])
-  const key = '$f_' + (typeof opts.key === 'string' ? opts.key : typeof request === 'string' && !opts.transform && !opts.default ? hash([request, opts]) : fallback)
+  if (process.dev && !opts.key && !fallback && Object.values(opts).some(v => typeof v === 'function' || v instanceof Blob)) {
+    console.warn('[nuxt] [useFetch] You should provide a key when passing options that are not serializable to JSON:', opts)
+  }
+  const key = '$f_' + (typeof opts.key === 'string' ? opts.key : typeof request === 'string' && !opts.transform && !opts.default ? hash([request, { ...opts, transform: null }]) : fallback)
+
   const _request = computed(() => {
     let r = request as Ref<FetchRequest> | FetchRequest | (() => FetchRequest)
     if (typeof r === 'function') {
@@ -48,16 +52,32 @@ export function useFetch<
     return (isRef(r) ? r.value : r) as NitroFetchRequest
   })
 
+  const {
+    server,
+    lazy,
+    default: defaultFn,
+    transform,
+    pick,
+    watch,
+    initialCache,
+    ...fetchOptions
+  } = opts
+
   const _fetchOptions = {
-    ...opts,
+    ...fetchOptions,
     cache: typeof opts.cache === 'boolean' ? undefined : opts.cache
   }
 
   const _asyncDataOptions: AsyncDataOptions<_ResT, Transform, PickKeys> = {
-    ...opts,
+    server,
+    lazy,
+    default: defaultFn,
+    transform,
+    pick,
+    initialCache,
     watch: [
       _request,
-      ...(opts.watch || [])
+      ...(watch || [])
     ]
   }
 

diff --git a/packages/nuxt/src/app/composables/ssr.ts b/packages/nuxt/src/app/composables/ssr.ts
@@ -3,8 +3,8 @@ import type { CompatibilityEvent } from 'h3'
 import { useNuxtApp } from '#app'
 import { NuxtApp } from '#app/nuxt'
 
-export function useRequestHeaders<K extends string = string> (include: K[]): Record<K, string>;
-export function useRequestHeaders (): Readonly<Record<string, string>>;
+export function useRequestHeaders<K extends string = string> (include: K[]): Record<K, string | undefined>
+export function useRequestHeaders (): Readonly<Record<string, string | undefined>>
 export function useRequestHeaders (include?) {
   if (process.client) { return {} }
   const headers: Record<string, string | string[]> = useNuxtApp().ssrContext?.event.req.headers ?? {}
Original file line number	Diff line number	Diff line change
Expand Up		@@ -20,4 +20,4 @@ Option \| Default \| Description

		The port and host can also be set via NUXT_PORT, PORT, NUXT_HOST or HOST environment variables.

		This command sets `process.env.NODE_ENV` to `development`. To override, define `NODE_ENV` in a `.env` file or as command-line argument.
		This command sets `process.env.NODE_ENV` to `development`.