如何修复意外令牌“/”的 ESLint 解析错误?
Posted
技术标签:
【中文标题】如何修复意外令牌“/”的 ESLint 解析错误?【英文标题】:How can I fix ESLint Parsing Error for unexpected token "/"? 【发布时间】:2019-04-03 23:05:55 【问题描述】:const Index = () => (
<div>
<p>Hello World</p>
<Link href="/posts">
<a>Posts</a>
</Link>
</div>
)
ESLint 正在为结束 </p>
标记返回解析错误(意外标记)。我错过了什么? JSX 中不允许使用普通的 html 属性吗? (div
似乎工作正常)
确切的错误是:
[eslint] Parsing error: Unexpected token "/"
ESLint 已安装
ESLint React 已安装
ESLint React 配置在.eslintrc.json
编辑:
使用 VS Code(带有 ESLint 插件)部分.eslintrc.json
:
"env":
"browser": true,
"commonjs": true,
"es6": true
,
"extends": "eslint:recommended",
"parserOptions":
"ecmaFeatures":
"experimentalObjectRestSpread": true,
"jsx": true
,
"sourceType": "module"
,
"plugins": [
"react"
],
"rules":
...
【问题讨论】:
linter 绝对有问题。尝试删除该行,运行 linter 并再次添加该行。 @Phiter : 可惜没用 请向我们展示您的.eslintrc.json
文件。看起来您的 eslint 解析器未配置为理解 JSX。
@richardgirges:添加
尝试重新输入</p>
那里可能有一些隐藏字符。
【参考方案1】:
我在 Visual Studio 2017(非代码) 中收到了类似的错误。
import
语句开头出现“ESLint 遇到解析错误”错误。
janniks 的解决方案对我不起作用。我怀疑是因为"es6: true
"enable[s] all ECMAScript 6 features except for modules"。
由于我使用的是 TypeScript,我 don't want to use babel-eslint
,根据 Sean 的回答(尽管它确实解决了普通 JS 文件中的解析错误)。
关键的权衡可以总结为:
babel-eslint
支持 TypeScript 本身没有的附加语法,但是typescript-eslint
支持根据类型信息创建规则, 这对 babel 不可用,因为没有类型检查器。
相反,我继续使用“@typescript-eslint/parser”。以下是我的最小工作.eslintrc
:
"parser": "@typescript-eslint/parser",
"parserOptions":
"sourceType": "module"
,
"rules":
"quotes": [ "error", "single" ]
注意:即使我删除了 "parser"
行,该错误也已在纯 JS 文件(不是 TS)中解决,因此使用默认的 eslint 解析器。
【讨论】:
天啊!谢谢!!!我花了几乎一整天的时间来追查这个。每个人都说使用“babel-eslint”。奇怪的是,这只是偶尔起作用。每次我进行更改时,它都会再次抛出错误。这似乎终于解决了。【参考方案2】:我今天在设置一个新的 React 项目时遇到了同样的问题。对我有用的修复是安装babel-eslint
包(npm install babel-eslint --save-dev
或yarn add babel-eslint -D
)。然后我将"parser": "babel-eslint"
添加到我的.eslintrc
配置文件中。与使用默认解析器相比,这似乎有助于 babel 和 ESLint 更好地相处。
【讨论】:
嗨 - 这可能是一个有用的答案 - 但是 - 如果你能解释 为什么 它会解决问题会更好。【参考方案3】:我不确定是什么导致了问题,但这为我解决了问题。我将.eslintrc.json
更改为以下内容:
"env":
"browser": true,
"commonjs": true,
"es6": true
,
"extends": [
"standard",
"standard-react"
]
我也留下了原来的rules
。
这个问题似乎有多种不同的原因,所以也请查看其他答案。
【讨论】:
对我来说,罪魁祸首是"standard-react"
。以上是关于如何修复意外令牌“/”的 ESLint 解析错误?的主要内容,如果未能解决你的问题,请参考以下文章