Skip to content

Nuxt Image (dependencies) causing hydration mismatch in production #1735

@nddr

Description

@nddr

Issue:
Only in production, a hydration mismatch is caused when calling an /api route. The image below shows the output in the console. See reproduction code for more details.

Image

Stack:
Nuxt: 3.16
Node: 19.7.0 & 22.13.0

Code for reproduction:
https://stackblitz.com/edit/github-uqrob3fw

Steps:

  1. Nuxt Starter ^
  2. npm i @nuxt/image
  3. npm upgrade <- This is the culprit.

Only after running npm upgrade does the issue begin. From this point on I don't know how to further diagnose this issue.
If its worth anything, @nuxt/fonts also caused this same issue before the release of 0.11.0.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions