Keywords: ESLint | ECMAScript | JavaScript Parsing
Abstract: This article provides an in-depth analysis of the ESLint error 'Parsing error: The keyword 'const' is reserved', identifying its root cause as compatibility issues with ECMAScript 6 features due to ESLint's default ES5 syntax checking. Through comprehensive configuration of parser options and environment settings, it offers complete .eslintrc.json configuration examples, explores the mechanism of ecmaVersion parameters and the importance of env configuration, helping developers properly configure ESLint to support modern JavaScript syntax.
Problem Background and Error Analysis
During JavaScript development using ESLint for code quality checking, developers often encounter parsing errors like Parsing error: The keyword 'const' is reserved. This error typically occurs when using ECMAScript 6 (ES6) and later syntax features, particularly when code includes ES6 additions such as const, let, arrow functions, and other modern JavaScript features.
Root Cause Investigation
ESLint's default configuration is based on ECMAScript 5 (ES5) standards for syntax parsing and checking. In the ES5 specification, const is not a valid keyword but is marked as a "reserved word". When ESLint encounters const declarations, the parser cannot recognize this ES6-added keyword, resulting in parsing errors.
Consider the following typical problematic code example:
const express = require('express');
const app = express();
const _ = require('underscore');
While this code is perfectly valid in modern Node.js environments, ESLint's default ES5 parser cannot properly handle const declarations, leading to parsing failures.
Solution: Configuring ESLint Parser Options
To resolve this issue, ESLint must be configured to support newer ECMAScript versions. The most effective approach involves specifying parser options and environment settings through a .eslintrc.json configuration file.
Creating Configuration File
Create a .eslintrc.json file in the project root directory and add the following configuration:
{
"parserOptions": {
"ecmaVersion": "latest"
},
"env": {
"es6": true
}
}
Configuration Parameters Detailed Explanation
parserOptions.ecmaVersion: This option specifies which ECMAScript version ESLint should use for parsing. Setting it to "latest" indicates using the latest stable version, ensuring all modern JavaScript features are correctly recognized.
env.es6: Environment configuration enables ES6 global variables and syntax. When set to true, ESLint recognizes const, let, class and other ES6 features as valid syntax, while also enabling corresponding global variables like Promise, Set, etc.
Configuration Verification and Testing
After configuration, rerun ESLint checks. The previous parsing errors should disappear, and code should pass syntax checks normally. To verify configuration effectiveness, create a simple test file:
// Testing ES6 features
const message = 'Hello ESLint';
let counter = 0;
const arrowFunc = () => console.log(message);
class TestClass {
constructor() {
this.value = counter++;
}
}
If configured correctly, this code containing multiple ES6 features should not generate any parsing errors.
Advanced Configuration Recommendations
For more complex projects, consider the following advanced configuration options:
Specifying Specific Versions: If projects require specific ECMAScript version support, set ecmaVersion to concrete numbers like 2020, 2021, etc., ensuring code features completely match the target environment.
Module Support: If projects use ES6 module systems, add "sourceType": "module" to parserOptions:
{
"parserOptions": {
"ecmaVersion": "latest",
"sourceType": "module"
},
"env": {
"es6": true
}
}
Common Issue Troubleshooting
If problems persist after configuration, check the following aspects:
Configuration File Location: Ensure the .eslintrc.json file is located in the project root directory, or that ESLint can correctly identify the configuration file location.
Cache Issues: Sometimes ESLint caches configuration information; try clearing the cache or restarting the development server.
Editor Integration: If using editor plugins, ensure the plugin has reloaded the latest ESLint configuration.
Conclusion
The ESLint const keyword parsing error is a common configuration issue rooted in the default ES5 parser's inability to recognize ES6 and newer version syntax features. By properly configuring parserOptions.ecmaVersion and env.es6 options, this problem can be easily resolved, enabling ESLint to perfectly support modern JavaScript development. Appropriate ESLint configuration not only eliminates syntax parsing errors but also provides accurate code quality feedback, helping developers write more robust and maintainable code.