vue3 Error on Cannot read properties of null (reading ‘insertBefore‘)报错无法正常显示，解决办法。

vue3报错Cannot read properties of null (reading ‘insertBefore’)

本地启动时，页面所有操作正常，显示正常；部署到生产环境后，数据驱动DOM变化的操作会导致如下报错。
Cannot read properties of null (reading 'insertBefore')

这个错误，导致页面显示出现异常，无法正常显示。

猜测原因

模板渲染导致无法找到，可能的原因有以下三个：

1. v-if 导致:（使用v-show替换了v-if）
2. v-for导致：
3. 数据初始化为undefined，但是在模板中有调用或者渲染。

解决办法

可以通过逐步排查页面的代码，注释代码，发布生产查看。试出看问题出在哪里。

1. 替换代码

我的页面最终发现问题所在是因为v-if，然后使用v-show替换了v-if就不存在报错问题。

2. 升级版本

还有发现解决办法，可以 将Vue 更新到最新版本 ([email protected]) 来修复它。