vue 使用 eslint 报错 [vue/no-parsing-error] Parsing error: x-invalid-end-tag.
发布时间
阅读量:
阅读量
项目环境及编辑器
项目框架:vue iview
编辑器:vscode
错误提示
见下图:[vue/no-parsing-error] Parsing error: x-invalid-end-tag.

原因
In the eslint-plugin-vue project, it has been identified that the Col components contain issues.
解决办法
以下三种办法都能搜出来,这里做个总结以及记录遇到的问题:
作者给出的办法

关闭 vscode 的代码检查

必须注意的是,在以下情况下‘配置 eslint 规则’其配置内容无效

Vetur 采用了某个版本的 eslint-plugin-vue 来校验代码模板,并且 Linting 配置采用了 $ eslint plugin vue 的基础规范集合。
该种Linting功能无法自定义,并依赖于eslint-plugin-vue的固定版本。如果要配置模板linting规则:
vetur.validation.template: false- 请安装Eslint插件
- 在你的项目中运行以下命令:
yarn add -D eslint eslint-plugin-vue - 设置规则
–
参考:
Vetur:VSCode下强大的Vue开发工具
Linting for<template>
配置 eslint 规则
安装
在安装过程中,请留意查看npm提供的提示信息。我在实际操作中遇到的情况是持续收到版本不符的错误提示。以下是我在正确配置后所使用的版本信息:
"devDependencies": {
"eslint": "^4.14.0",
"eslint-loader": "^2.2.1",
"eslint-plugin-vue": "^4.7.1",
"vue-eslint-parser": "^2.0.3"
},
代码解读
刚刚想复现一下又不提示了,以上版本仅做个参考吧。
配置 .eslintrc.js
module.exports = {
...,
// 注意,plugins 里别忘了加 vue 选项
plugins: [
'html',
'vue'
],
rules: {
...,
"quotes": [0, "single"], // 禁用引号检查 引号类型 `` "" ''
"semi": 0, // 禁用分号检查 [1, "always"]: 需要分号, [2, "never"]: 不加分号, 0: 禁用此项
"vue/html-self-closing": "off",
"vue/no-parsing-error": [2, {
"x-invalid-end-tag": true,
}],
"indent": "off", // 禁用缩进检查
}
}
代码解读
如果你遇到了这个错误 Definition for rule 'vue/no-parsing-error' was not found 那么可能是因为没有在插件中添加 vue 选项
参考:
iview输入字段出现 x-invalid-end-tag 报错
禁止解析错误在 (vue/no-parsing-error) 中发生
分析npm依赖管理中的 peerDependencies 问题
探讨npm依赖版本管理的相关问题
–
全部评论 (0)
还没有任何评论哟~
