Vue · VUE0010
Use data-allow-mismatch only surgically
Finds Vue SSR code that can be written with a clearer framework-supported pattern.
vue/ssr/data-allow-mismatch-surgicalsrc/rule-packs/vue/rules/vue/data-allow-mismatch-surgical.ts Upstream docs Run this rule
pnpm vite-doctor . --framework vue --rules vue/ssr/data-allow-mismatch-surgical
Why it matters
Server-rendered markup must match the first client render. Browser-only state, time, randomness, or hash-sensitive URLs can create hydration mismatches.
Recommended fix
Use the Vue-supported data allow mismatch surgical pattern instead.
Useful links
Example
Scope allowed mismatch narrowly
Before
<template>
<main data-allow-mismatch>
<UserProfile />
</main>
</template>
After
<template>
<time data-allow-mismatch>{{ formattedNow }}</time>
</template>