ESLint 是一种语法检查工具，可以帮助我们在编码的过程中尽早发现问题，提高代码的质量和可维护性。然而，在使用 ESLint 的过程中，我们有时候会遇到 “Parsing error: Unexpected token” 错误，这是因为 ESLint 要求使用一些最新的 JavaScript 语言特性，而这些特性在一些老版本的浏览器中并不支持。那么该如何解决这个问题呢？本文就会对这个问题进行详细的讲解并提供解决方法。
问题分析
在使用 ESLint 进行代码检查时，我们可能会看到如下的错误信息：
Parsing error: Unexpected token
这个错误信息通常的意思是“解析错误：未预期的标记”，也就是说，ESLint 并不能正确地解析我们的代码，因为我们在代码中使用了一些新的语言特性，而在解析这些特性时出现了问题。
举个例子，例如我们的代码中使用了 ECMAScript 6 的语法，但是我们使用的编辑器或者 IDE 并不支持 ECMAScript 6，那么就很有可能导致出现 “Parsing error: Unexpected token” 错误。
解决方法
针对以上问题，我们可以采用如下解决方法：
- 指定一个合适的解析器。
ESLint 提供了多种解析器，每个解析器对应了不同的 JavaScript 版本。我们可以通过在 .eslintrc 文件中指定 parser 选项来使用特定的解析器。
{
"parser": "babel-eslint"
}上面的配置示例将使用 babel-eslint 解析器解析 JavaScript 代码。当然，选择解析器的方式不止一种，我们可以自行选择或者使用别人推荐的解析器来解决该问题。
- 指定一个规范的环境。
使用特定的 ECMAScript 版本时，需要给 ESLint 指定一个规范的环境。我们可以通过在 .eslintrc 文件中指定 env 选项来指定特定的环境。
{
"env": {
"es6": true
}
}上面的配置示例将开启对 ECMAScript 6 的支持。
- 配置 parserOptions。
此方法是同时指定解析器和环境的，我们可以通过配置 parserOptions 选项来指定一个解析器和环境。例如：
{
"parserOptions": {
"ecmaVersion": 2017
},
"env": {
"es6": true
}
}上面的配置示例同样开启了对 ECMAScript 6 的支持，不过这里是通过 parserOptions 的 ecmaVersion 选项来指定的。
- 配置 babel 插件。
如果我们的代码中使用了一些特定的 ECMAScript 6 语法，例如箭头函数、解构赋值等，但是我们的环境不支持这些语法，那么就可以考虑使用 babel 插件来对代码进行转换。该方法需要先安装 babel-eslint 和 babel-plugin-transform-runtime 这两个依赖，然后在 .babelrc 文件中来定义需要转换的 ECMAScript 特性。例如：
{
"parser": "babel-eslint",
"plugins": [
"transform-runtime"
],
"env": {
"es6": true
}
}示例代码
以下是一个包含了箭头函数、解构赋值等 ECMAScript 6 语法的代码示例，该代码在使用 ESLint 进行检查时可能会出现 “Parsing error: Unexpected token” 错误。
const person = {
name: "Tom",
age: 18,
sayHello: () => {
console.log(`Hello, my name is ${person.name} and I am ${person.age} years old.`);
}
};
const { name, age } = person;
console.log(`My name is ${name} and I am ${age} years old.`);
person.sayHello();使用以上推荐的任意一种解决方法都可以解决该问题，我们可以根据实际情况进行选择和配置。
总结
本文介绍了使用 ESLint 进行代码检查时可能遇到的 “Parsing error: Unexpected token” 错误，并提供了多种解决方法。通过对以上方法的学习和实践，相信读者可以更好地使用 ESLint 工具来提高代码质量并减少错误率。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/659fba4fadd4f0e0ff83f56b