在Vue的官方网站上,它给出了一个很好的简短例子来展示如何通过Vue进行ssr。
(https://stackblitz.com/edit/vue-ssr-example-qaztqn?file=package.json
(
我将此示例复制到本地机器上并成功运行。
然而,在我尝试通过vite本地捆绑vue后,我得到了水合不匹配错误:
index.0977acf5.js:2980 Hydration completed but contains mismatches.
在我更改之前,官方示例从CDN的index.html
中导入vue。我所做的唯一更改是在本地绑定vue,然后引用整个绑定的js文件。
我将失败的示例上传到github:https://github.com/yangjiang3973/vue-ssr-demo
有人能看看并告诉我为什么会发生这种水合错误吗?
谢谢!
如果您有无效的html,例如,也可能出现水合节点不匹配
<p>
<p></p>
</p>
或
<span>
<p></p>
</span>
在上面的示例中,嵌套是非法的,不能在p内部嵌套p,也不能在span内嵌套p