Nuxt · Hydration & SSR

`NUXT0031`Avoid client-only conditionals in SSR templates

Flags client conditional in template in Nuxt hydration code before it leaks into runtime behavior.

vite-doctor/nuxthydrationwarnSuggestion

nuxt/hydration/no-client-conditional-in-template src/rule-packs/nuxt/rules/nuxt/no-client-conditional-in-template.ts Upstream docs

Why it happens

Server-rendered markup must match the first client render. Browser-only state, time, randomness, or hash-sensitive URLs can create hydration mismatches.

Fix

Remove client conditional in template, or move it to the Nuxt runtime/API that owns that behavior.

Example

Use ClientOnly for client conditions

Before

<template>
  <p v-if="import.meta.client">Client only</p>
</template>

After

<template>
  <ClientOnly>
    <p>Client only</p>
  </ClientOnly>
</template>

Verify the fix

Run only this rule after editing so the report stays focused on the diagnostic you are closing:

pnpm nuxt doctor --rules nuxt/hydration/no-client-conditional-in-template

Useful links

Upstream docs

nuxt/hydration/no-client-conditional-in-template

NUXT0031Avoid client-only conditionals in SSR templates