【Vue.js 3.0】不使用根标签,Error:[vue/no-multiple-template-root] The template root requires exactly one ...

[vue/no-multiple-template-root]The template root requires exactly one element.eslint-plugin-vue

  • 原因分析
  • 解决方案

原因分析

  • 报错示例,如图所示:
    【Vue.js 3.0】不使用根标签,Error:[vue/no-multiple-template-root] The template root requires exactly one ..._第1张图片
    上述问题的产生,一般是由于 Visual Studio Code 中安装了 Vetur 插件,它在检测 vue-html 模板时,使用了 eslint-plugin-vue 插件。

解决方案

  • 查看是否安装了 Vetur 插件
    【Vue.js 3.0】不使用根标签,Error:[vue/no-multiple-template-root] The template root requires exactly one ..._第2张图片
    【Vue.js 3.0】不使用根标签,Error:[vue/no-multiple-template-root] The template root requires exactly one ..._第3张图片
  • 点击 文件 -- 首选项 -- 设置 进入设置页
    【Vue.js 3.0】不使用根标签,Error:[vue/no-multiple-template-root] The template root requires exactly one ..._第4张图片
  • 搜索 eslint,查看 Validate vue-html in using eslint-plugin-vue 是否勾选
    【Vue.js 3.0】不使用根标签,Error:[vue/no-multiple-template-root] The template root requires exactly one ..._第5张图片
  • 取消勾选 Validate vue-html in using eslint-plugin-vue
    【Vue.js 3.0】不使用根标签,Error:[vue/no-multiple-template-root] The template root requires exactly one ..._第6张图片
  • 查看 vue 组件,可以看到,报错信息已经不存在了
    【Vue.js 3.0】不使用根标签,Error:[vue/no-multiple-template-root] The template root requires exactly one ..._第7张图片

你可能感兴趣的:(Bug,集锦,vue)