Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2024-11-25 23:22:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(nuxt): warn when nesting nuxt links when SSR on dev (#23286)

Browse Source
This commit is contained in:
Daniel Roe 2023-09-28 11:08:20 +01:00 committed by GitHub
parent 2b273fa8e1
commit 4b5e6ff195
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
packages/nuxt/src/app/components/nuxt-link.ts
View File

@ -1,5 +1,5 @@
import type { ComputedRef, DefineComponent, PropType } from 'vue' import type { ComputedRef, DefineComponent, InjectionKey, PropType } from 'vue'
import { computed, defineComponent, h, onBeforeUnmount, onMounted, ref, resolveComponent } from 'vue' import { computed, defineComponent, h, inject, onBeforeUnmount, onMounted, provide, ref, resolveComponent } from 'vue'
import type { RouteLocation, RouteLocationRaw } from '#vue-router' import type { RouteLocation, RouteLocationRaw } from '#vue-router'
import { hasProtocol, parseQuery, parseURL, withTrailingSlash, withoutTrailingSlash } from 'ufo' import { hasProtocol, parseQuery, parseURL, withTrailingSlash, withoutTrailingSlash } from 'ufo'
@ -12,6 +12,7 @@ import { cancelIdleCallback, requestIdleCallback } from '../compat/idle-callback
const firstNonUndefined = <T> (...args: (T | undefined)[]) => args.find(arg => arg !== undefined) const firstNonUndefined = <T> (...args: (T | undefined)[]) => args.find(arg => arg !== undefined)
const DEFAULT_EXTERNAL_REL_ATTRIBUTE = 'noopener noreferrer' const DEFAULT_EXTERNAL_REL_ATTRIBUTE = 'noopener noreferrer'
const NuxtLinkDevKeySymbol: InjectionKey<boolean> = Symbol('nuxt-link-dev-key')
export type NuxtLinkOptions = { export type NuxtLinkOptions = {
componentName?: string componentName?: string
@ -236,6 +237,15 @@ export function defineNuxtLink (options: NuxtLinkOptions) {
} }
} }
if (import.meta.dev && import.meta.server && !props.custom) {
const isNuxtLinkChild = inject(NuxtLinkDevKeySymbol, false)
if (isNuxtLinkChild) {
console.log('[nuxt] [NuxtLink] You can\'t nest one <a> inside another <a>. This will cause a hydration error on client-side. You can pass the `custom` prop to take full control of the markup.')
} else {
provide(NuxtLinkDevKeySymbol, true)
}
}
return () => { return () => {
if (!isExternal.value) { if (!isExternal.value) {
const routerLinkProps: Record<string, any> = { const routerLinkProps: Record<string, any> = {