Subscribe on changes!

[Vue warn]: Hydration children mismatch in <div>: server rendered element contains fewer child nodes than client vdom.

avatar
Sep 14th 2023

Vue version

3.34

Link to minimal reproduction

https://stackblitz.com/edit/nuxt-starter-rhndgs?file=app.vue

Steps to reproduce

Wait for the page to load and open the console

What is expected?

There should be no warning

What is actually happening?

There was a warning

System Info

System:
    OS: macOS 12.3.1
    CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
    Memory: 19.05 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 18.16.0 - ~/.nvm/versions/node/v18.16.0/bin/node
    Yarn: 1.22.18 - /usr/local/bin/yarn
    npm: 9.5.1 - ~/.nvm/versions/node/v18.16.0/bin/npm
    pnpm: 8.7.5 - ~/.nvm/versions/node/v18.16.0/bin/pnpm
  Browsers:
    Chrome: 116.0.5845.140
    Safari: 15.4

Any additional comments?

No response

avatar
Sep 14th 2023

Please open issues in the component library repo.