vuejs / vitepress

Vite & Vue powered static site generator.
https://vitepress.dev
MIT License
13.31k stars 2.15k forks source link

Hydration completed but contains mismatches when linking directly to pages #4099

Open AlexGodbehere opened 4 months ago

AlexGodbehere commented 4 months ago

Describe the bug

If I first navigate to root I'm able to navigate through the documentation without issue, however if I send a link to a particular page the content renders for a split second and then disappears. The console outputs Hydration completed but contains mismatches.. My site is being served behind Cloudflare.

Reproduction

Build for production, validate that all pages are navigable. Copy a link to a specific page and paste it into an incognito session.

Expected behavior

The page renders as expected.

System Info

System:
    OS: macOS 14.5
    CPU: (14) arm64 Apple M3 Max
    Memory: 7.86 GB / 36.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Yarn: 1.22.22 - ~/Library/Application Support/Herd/config/nvm/versions/node/v18.20.3/bin/yarn
    npm: 10.7.0 - ~/Library/Application Support/Herd/config/nvm/versions/node/v18.20.3/bin/npm
    bun: 1.1.13 - ~/.bun/bin/bun
  Browsers:
    Chrome: 127.0.6533.89
    Safari: 17.5
  npmPackages:
    vitepress: ^1.3.1 => 1.3.1

Additional context

No response

Validations

brc-dd commented 4 months ago

Please provide a reproducible example. Check if you’ve auto minify disabled on cloudflare and are not rendering any invalid HTML. Does this issue happen if you build and preview locally? Can you try building with DEBUG=true env var?

Zhengqbbb commented 4 months ago

https://vitepress.dev/guide/deploy#netlify-vercel-cloudflare-pages-aws-amplify-render

CleanShot 2024-08-03 at 00 28 10@2x

CleanShot 2024-08-03 at 00 27 40@2x