no-unused-expressions warning for optional chaining
See original GitHub issueDescribe the bug
I just upgrade react-scripts
to 3.3.0. I am able to use nullish coalescing, but when I attempt to use optional chaining, I can’t compile as I get this error:
./src/components/Select/Select.tsx
Line 141:5: Expected an assignment or function call and instead saw an expression no-unused-expressions
Search for the keywords to learn more about each error.
The line in question is:
this.props.onChange?.(resultingValue);
Did you try recovering your dependencies?
No, I don’t have time at the moment. If this might help I’ll try it.
Which terms did you search for in User Guide?
I searched for optional chaining, no-unused-expressions, eslint optional chaining.
Environment
npx: installed 91 in 30.467s
Environment Info:
System:
OS: Windows 10 10.0.17134
CPU: (8) x64 Intel(R) Core(TM) i7-6700 CPU @ 3.40GHz
Binaries:
Node: 12.2.0 - C:\Program Files\nodejs\node.EXE
Yarn: Not Found
npm: 6.9.0 - C:\Program Files\nodejs\npm.CMD
Browsers:
Edge: 42.17134.1098.0
Internet Explorer: 11.0.17134.1
npmPackages:
react: ^16.12.0 => 16.12.0
react-dom: ^16.12.0 => 16.12.0
react-scripts: 3.3.0 => 3.3.0
npmGlobalPackages:
create-react-app: Not Found
Steps to reproduce
- Use optional chaining.
- Attempt to run
npm start
.
Expected behavior
I expected the app to compile and for the code to function like:
this.props.onChange !== undefined && this.props.onChange(resultingValue);
Actual behavior
The app failed to compile and gave the above message.
Issue Analytics
- State:
- Created 4 years ago
- Reactions:108
- Comments:33 (5 by maintainers)
Top Results From Across the Web
Solved: Optional Chaining no-unused-expressions ESLint Error
Fix for "no-unused-expressions" ESLint error when using JavaScript optional chaining.
Read more >ESLint throwing no-unused-expressions with `obj?.fn ...
Am I using optional chaining wrong? Expected an assignment or function call and instead saw an expression. eslint no-unused-expressions.
Read more >no-unsafe-optional-chaining - Pluggable JavaScript Linter
Rule Details. This rule aims to detect some cases where the use of optional chaining doesn't prevent runtime errors. In particular, it flags...
Read more >Typescript optional chaining and ESLint `no-unused ...
Typescript 3.7 introduced the long awaited optional chaining syntax. When using the commonly enabled ESLint rule `no-unused-expressions`, ...
Read more >prefer-optional-chain | typescript-eslint
.exports = { · "rules": { · "@typescript-eslint/prefer-optional-chain": "warn" · } · }; ...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Support already exists, you need to enable
@typescript-eslint/no-unused-expressions
instead ofno-unused-expressions
.https://github.com/typescript-eslint/typescript-eslint/issues/1241#issuecomment-556027910
I tried when I enable typescript variant but keep regular one and sadly, it will complain. Only when that regular rule is explicitly disabled, it works correctly.
So shouldn’t that rule be enabled ineslint-config-react-app
instead? It should work for JS files just fine if I am not mistaken.Oh I see it’s been already done: https://github.com/facebook/create-react-app/pull/8003
It looks like there’s a workaround by using eslint-plugin-babel if anyone wants to try that out?