vscode Vue3 多根节点语法检验错误fix
错误
众所周知vue3支持多个根节点,但在vscode中eslint检查会针对多根节点报错。虽然不影响使用,但看着很不舒服:
The template root requires exactly one element.
fix方法
项目根目录下.vscode目录,有一个settings.json
的文件(如果没有则新建之)
加入一行:
"vetur.validation.template": false
不进行模板检查。可以不提示这个错误了。但模板检查也失去了。
github上有哥们忍不住发问:
Disable the whole template validation for the sake of fixing one warning? Is that a suggestion?
这个建议确实不是bestway,然后有下面有哥们回复
The Vue 3 rules are now automatically used when Vue3.
You don't need disable it now.
And If you use eslint in project, you can disable it.
Let your project eslint replace it.
The two functions are the same.
https://vuejs.github.io/vetur/linting-error.html#linting
上面这个链接挂了。确实eslint已支持vue3的语法检查了,为何还会提示这个错误呢?
再往下看:
Disabling the template validation defeats the whole purpose of having Vetur.
I resolved the issue by moving the project to the root of the workspace. So if you're project is in a subfolder (e.g workspace > subfolder > project), Vetur looks for the package.json file in the subfolder and not in your project folder, hence the reason why it doesn't work properly.
果不其然,我的项目在子目录下,我重新用vscode打开项目后,错误消失了。