airbnb / airbnb/javascript

Issue with eslint-config-airbnb-base and `optional chaining` operator

Open
#2,541 10 comments 7 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
148k
Forks
26.6k
PR merge metrics
No merged PRs in 30d

Description

Issue with `eslint-config-airbnb-base` and [optional chaining](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining) operator `?.` `(JavaScript)`

```javascript
// .eslintrc.js
module.exports = {
env: { es2021: true },
extends: [ 'airbnb-base' ]
};
```

```javascript
const o = {};
const a = o?.a;
```
For the above code, ESLint reports `Parsing error: Unexpected token` at the optional chaining operator `?.`

ESLint rules for **optional chaining** should work with `parserOption: {ecmaVersion: 2020}` or higher and which [eslint automatically sets](https://eslint.org/docs/user-guide/configuring/language-options) because `env: {es2021: true}` is used in the config above.

However when `airbnb-base` is used, an explicit `parserOption: ecmaVersion: 12` seems to be required to resolve the above issue as such:

```javascript
// .eslintrc.js
module.exports = {
env: { es2021: true },
extends: [ 'airbnb-base' ],
parserOptions: { ecmaVersion: 12 }
};
```

(Note: ecmaVersion: 11 should also work)

The error does not occur without airbnb-base as below:
```javascript
// .eslintrc.js
module.exports = {
env: { es2021: true }
};
```

Although the fix is simply to explicitly state `ecmaVersion` it can take a while to figure out that the `Parsing error: Unexpected token` is because of airbnb-base.

When this issue occors, all other lint errors in the file are not reported which means eslint stops working!

For a better developer experience, this issue could be looked into or documented well.

The above issue occurred with:

```
Local ESLint version: ^8.7.0
Global ESLint version: ^8.7.0
Node version: v14.17.3
npm version: 6.14.13
Operating System: Linux
```

Contributor guide

No contributing guide indexed for this repository

Research direction

Reproduce the parsing error using the .eslintrc.js configurations and the optional-chaining example, comparing airbnb-base with the configuration without it. Inspect how airbnb-base sets parser options; done means optional chaining parses with env es2021 without an explicit ecmaVersion, or the required configuration is clearly documented.

Written by the indexing model from the issue text.

Assessment

Tech stack
eslint, javascript
Domain
tooling
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.