Why are there two divs with the same id of app?

[aysiscore]

In public/index.html there is a <div id="app"></div>

And then once again in src/App.vue

When the app is rendered to the browser there are now two div elements of the same id which is not HTML5 compliant code. I end up with:

<div id="app" data-v-app="">
<div id="app">
<!-- router content here -->
</div>
</div>

Why is this so and how can we change it so that the ids are unique for each div.

[zhangzhuang15]

I fix this issue on my own repo branch (https://github.com/zhangzhuang15/vue3-example-ssr/tree/jasonzhang-feature), you can take a try.