关于 vue3 不使用根标签报错提示 [vue/no-multiple-template-root] The template root requires exactly one element

最新推荐文章于 2024-05-29 10:27:49 发布
最新推荐文章于 2024-05-29 10:27:49 发布
阅读量1.4k 收藏 1
点赞数 2
分类专栏： 前端 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/myt2000/article/details/121417608
版权

关于 vue3 不使用根标签报错提示 [vue/no-multiple-template-root] The template root requires exactly one element

安装了Vetur插件， .Vue的文件中总是有这些红线报错提示
报错提示
点击菜单 file --> Preferences --> Settings
输入eslint， 取消勾选该选项
取消勾选

这样就不会有报红提示了

myt2000
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue3+eslint遇到 The template root requires exactly one element.eslintvue/no-multiple-template-root解决方案
悲莫悲兮生别离
05-07 2066
vue3+eslint遇到 The template root requires exactly one element.eslintvue/no-multiple-template-root 解决方案 找到eslint配置文件，我这里是 .eslintrc.js 把 extends 中的 ‘plugin:vue/essential’，改成’plugin:vue/vue3-essential’ 搞定 网上文章说是vetur的问题，但我这里不是 贴一下我的eslint配置 module.exports
Vue报错 The template root requires exactly one element
TOP的博客
01-07 2013
Vue报错 The template root requires exactly one element. Vue2解决 因为vue的模版中只能有一个根节点，由于不支持多根节点组件，所以在<template>中插入第二个元素就会报错，将<template>中的元素用一个大的<div>包起来，这样就可以在其中添加多个元素了 Vue3解决 在 3.x 中，组件可以包含多个根节点！但是为什么还会报错呢 是因为插件vetur设置了校验规则，改一下配置规则就不会显现错误了
The template root requires exactly one element vue/no-multiple-template-root
weixin_64652648的博客
09-06 1173
当你在使用element的过程中出现了这个错误就代表<template></template>内出现了一个或几个<div></div>,且没有一个div将template内的代码全部包括起来，这个时候只需要加上一个div就可以解决这个问题。
解决Vue3项目使用多个根标签提示[vue/no-multiple-template-root]The template root requires an element rather than
最新发布
qq_45569925的博客
05-29 364
报错截图 检查原因 第一步：检查是否安装了Vetur插件 第二步：左下角设置图标 ==》 设置 第三步：进入设置页面搜索 eslint 把 Vetur 的验证模板，取消勾选Validate vue-html in using eslint-plugin-vue 第四步：将错误提示页面关掉然后重新打开，即可正常显示
【Vue3】报错：The template root requires exactly one element
Love_Study2的博客
10-28 2230
标签中，根标签有多个，如： 1：用div标签包住就行了 2：在vue的.eslintrc.js 文件中配置： "vue/no-multiple-template-root":'off'
[vue/no-multiple-template-root]The template root requires exactly one element.eslint-plugin-vue
qq_48704579的博客
03-15 1338
是因为vue2<template></template>模板只能有一个根标签，插件vetur检查时会报错,此时的解决方法如下。在进行vue3项目是报错。
vue3代码报错：[vue/no-multiple-template-root]The template root requires exactly one element.eslint-plugin
weixin_51938803的博客
06-06 949
plugin-vue -> 第一个(Vetur › Validation: Template )取消勾选,即可。
vue-admin-beautiful-template:vue-admin-beautiful-template基础版
03-21
vue-admin-beautiful（element-ui） 地址 vue-admin-beautiful前端讨论QQ群972435319，1139183756 不论您加或不加，您都可以享受到开源的代码，感谢您的支持和信任，群内部提供vue-admin-beautifu基础版本...
element-demi:在Vue 2 3中使用Element UI的适配器
05-09
一个在Vue 2/3中使用Element UI的适配器。 :yo-yo: 只是个玩具 该库旨在测试postinstall npm挂钩。 安装完所有软件包之后。 该脚本将开始检查已安装的Vue版本，并根据本地Vue版本将导出重定向到。 :package: 安装 ...
vue3-element-admin：vue3 + element-plus + typescript 后台管理系统
05-04
vue3-element-admin 是【有来开源组织】基于 Vue3 + Vite4 + TypeScript + Element-Plus + Pinia 等前端主流技术栈从0到1搭建后台管理系统模板（前后端开源）。 后端是基于 Spring Boot 3.0 、Spring Security 6.0 ...
vue-template-babel-compiler:为基于 Babel 的 Vue.js SFC 启用 Optional Chaining 和许多新的 ES 特性
07-24
演示用法 # 1: Install in your Vue project directorynpm install --save-dev vue-template-babel-compiler# or:yarn add vue-template-babel-compiler --dev# 2: Run a script to substitute vue-template-es2015-...
vite-vue-ts-admin-template:vue3 +打字稿+ vite管理模板
04-10
vite-vue-ts-admin-template总览这是一个极简的 vue typescript vite admin 管理后台。它只包含了 element-plus & axios & svgicon & permission control & lint，这些搭建后台必要的东西。相关项目如何设置以及启动...
关于The template root disallows ‘＜template＞‘ elements. 错误解决方法
onetoone3的博客
07-17 392
'' elements. 错误
vue--The template root requires exactly one element.的解决办法
爱吃Java的羊的博客
11-25 2241
[vue/no-multiple-template-root] The template root requires exactly one element.eslint-plugin-vue 在vue中会出现以上问题 这是因为vue的模版中只有能一个根节点，所以在中插入第二个元素就会报错 解决方案： 将中的元素用一个大的包起来，这样就可以在其中添加多个元素了
关于 vue3 不使用根标签报错提示 [vueno-multiple-template-root] The template root requires exactly one element
Bejpse的博客
03-09 1342
报错提示 第一步 查看是否安装了Vetur插件 第二步 文件=>首选项=>设置 进入设置页搜索 eslint 把Vetur的验证模板，取消勾选Validate vue-html in using eslint-plugin-vue 报错提示就没有了
项目报错：[vue/no-multiple-template-root] The template root requires exactly one element.
nyf_unknow的博客
03-24 1万+
项目场景： 迁移组件 问题描述 黑屏且报错：[vue/no-multiple-template-root] The template root requires exactly one element. 原因分析： template中只允许模板里存在一个根节点 解决方案： 例如：在 template 中添加一个 标签，之后所有的组件全部加在 即可解决。 ...
vue3报错：The template root requires exactly one element终极解决办法
热门推荐
Y_soybean_milk的博客
04-22 2万+
兴冲冲的开启一个vue3项目，控制台却报错The template root requires exactly one element 我们知道，在vue2中，template中只能有一个根元素，但在vue3中，则去掉了这个限制 那么如何解决这个错误提示呢？ 方法一 可能是项目中引入的eslint报的错 解决方法：在项目的.eslintrc.js配置文件的rules中添加："vue/no-multiple-template-root": "off" rules: { 'no-console':
[vue/no-multiple-template-root] The template root requires exactly one element.eslint-plugin-vue
乐辞的博客
03-31 6665
[vue/no-multiple-template-root] The template root requires exactly one element.eslint-plugin-vue Vue3.0 脚手架报错 [vue/no-multiple-template-root] The template root requires exactly one element. eslint-plugin-vue 有道翻译： [vue/no-multiple-template-root]模板根需要一个元素。
vue/no-multiple-template-root] The template root requires exactly one element.eslint-plugin-vue
07-28
根据引用\[1\]中提供的解决方法，你可以在项目的.eslintrc.js配置文件的rules中添加以下代码来解决这个错误提示： ```javascript rules: { 'vue/no-multiple-template-root': 'off' } ``` 这样做的目的是将"vue/no-multiple-template-root"规则设置为"off"，即关闭该规则的检查。这样eslint就不会再报错关于模板根元素的多个元素的问题了。 另外，根据引用\[2\]中的描述，Vue 3中已经取消了在模板中只能有一个根元素的限制。因此，你可以放心地在Vue 3项目中使用多个根元素。 总结起来，你可以通过在.eslintrc.js配置文件中关闭"vue/no-multiple-template-root"规则来解决这个错误提示。 #### 引用[.reference_title] - *1* *2* [vue3报错：The template root requires exactly one element终极解决办法](https://blog.csdn.net/Y_soybean_milk/article/details/124338835)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值