vue
vue copied to clipboard
Improve Hydration Warnings
What problem does this feature solve?
When hydration fails the helpful information about the DOM structure and the source of the problem is logged with a console.warn which is not available on the production build. The only available message is "Failed to execute 'appendChild' on 'Node': This node type does not support this method." which is very hard to trace the error from.
What does the proposed API look like?
The console usage could be replaced by the warnHandler, an error or a configuration that controls how this warning is logged.
Hello 👋🏽 I am facing the same problem with non-reproducible hydration errors (observed on our error reporting tool). Have you been able to make any progress on this?
Unfortunately not, but It supposed to be on the roadmap for the upcoming Vue release, as announced during Vuejs Amsterdam.
Ah 😭 Good to know (Just for vue3 I guess)
I try to understand these errors by using a custom vue runtime on production build and adding a try/catch with a log to know where is my hydration issue. The detection helps already present in the vue runtime in dev mode, a simple thing would be to activate them in a production build because in my case these errors are not reproducible locally (dev mode and with no production data).