Qiankun Error: Target container with #container not existed while xxx mounting!

About this error report, the official documents are extremely imperfect, and there is too little information.

This means that when the main application is Vue, the route contains transition effect.

However, this is only a possibility of reporting this error, not necessarily caused by the main application, but also by the sub-application.

The reason for this error is: the container is lost during rendering the sub application;

Background: the main application reacts and the sub-application is Vue.

And traceability process:

After the breakpoint debugging, I found that there was a container at the beginning of render, but later, the dom of the whole page was lost.

When registering a sub-application, the loadapp function will call render once after it is executed. At this time, the container can be obtained, and the function will return a mount queue; When the queue is executed later, the container is null

At this time, it is speculated that there is code in the middle and the document has been changed, but it is impossible to determine whether it is a sub application or a main application.

First, check the main application. After switching the sub application, it can be accessed normally. Therefore, it is a sub application problem.

Continue to check the sub application and find the problem code document.write in the index.html file of the sub application.

After deletion, the sub application is normally accessed.

Conclusion:

Target container with #container not existed while xxx mounting

It means that it has a container at the beginning, because if it doesn’t exist at the beginning, the error should be: target container with #container not existing while XXX loading

At the beginning, but not in the middle, there must be a code that changes the document, resulting in the loss of the container. Therefore, you need to take the troubleshooting code from this reason.

Similar Posts: