關於這個報錯,官方文檔說的及其不完善,且信息太少。

意思就是:主應用為VUE時,路由含有過渡效果,就會出現。
但是這只是報這個錯誤的一種可能,不一定是主應用引起,子應用也會。
報此錯的原因是:渲染子應用的過程中,container容器丟失導致;
我遇到這個問題背景:主應用是 react,子應用 vue。
以及追溯過程:
- 打了斷點調試,發現在render的時候一開始是有 container容器的,但是到后面,整個頁面的dom都丟失了。
- 在注冊子應用的時候,執行完loadApp函數會調用一次render,這時可以獲取到container,函數會返回一個mount的隊列;這個隊列在后面執行的時候container為null
- 這時猜測是中間有代碼,更改了document,但是無法確定是子應用、還是主應用。
- 首先排查主應用,切換子應用之后,可以正常接入。因此是子應用問題。
- 繼續排查子應用,在子應用的index.html文件中發現問題代碼 document.write。
- 刪去后,子應用正常接入。
結論:
Target container with #container not existed while xxx mounting
說明它一開始是有container容器的,因為如果一開始就沒有的話,報錯應該是:Target container with #container not existed while xxx loading
一開始有,中途沒有了,那就一定是有代碼改變了document,導致container丟失。所以需要從這個原因取排查代碼。
