[Vuejs]-There are two elements in <template> when I creat a new Vue3 project, and my VScode warning

4👍

The origin of the problem in most cases: Vetur

I see this problem a lot lately. The solution has always been the same: uninstall Vetur and install Volar instead, it is the new recommended extension for Vue 3.

As you can see Vue 3 no longer requires a single root node for components so you have some extension that does not detect it. Vetur has had trouble adapting to Vue 3. Maybe you have a version configured for Vue 2. In any case I recommend you Volar.

If your problem is with eslint or another lintern

Look for this vue plugin specific rule in the .eslintrc config file or package.json:

rules: { 
    ...,
    "vue/no-multiple-template-root": "off" 
}
👤UXK

Leave a comment