Bug: eslint --fix breaks code when airbnb no-duplicate-imports happens
See original GitHub issueEnvironment
Node version: v14.17.1 npm version: 6.14.13 Local ESLint version: “^8.10.0” Global ESLint version: Operating System: macOS BigSur 11.6
What parser are you using?
Default (Espree)
What did you do?
Configuration
{
"env": {
"es2021": true,
"node": true
},
"extends": [
"plugin:react/recommended",
"airbnb"
],
"parserOptions": {
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": "latest",
"sourceType": "module"
},
"plugins": [
"react"
],
"rules": {
}
}
package.json
{
"name": "AwesomeProject",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"react": "17.0.2",
"react-native": "0.67.3"
},
"devDependencies": {
"@babel/core": "^7.17.5",
"@babel/runtime": "^7.17.2",
"@react-native-community/eslint-config": "^3.0.1",
"babel-jest": "^27.5.1",
"eslint": "^8.10.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-plugin-import": "^2.25.4",
"eslint-plugin-jsx-a11y": "^6.5.1",
"eslint-plugin-react": "^7.29.2",
"eslint-plugin-react-hooks": "^4.3.0",
"jest": "^27.5.1",
"metro-react-native-babel-preset": "^0.69.0",
"react-test-renderer": "17.0.2"
},
"jest": {
"preset": "react-native"
}
}
import {
StyleSheet,
View,
TextInput,
ImageBackground,
Image,
TouchableOpacity,
SafeAreaView
} from 'react-native';
import { I18nManager } from 'react-native';
What did you expect to happen?
expected it to format to:
import {
StyleSheet,
View,
TextInput,
ImageBackground,
Image,
TouchableOpacity,
SafeAreaView,
I18nManager
} from 'react-native';
What actually happened?
import {
StyleSheet,
View,
TextInput,
ImageBackground,
Image,
TouchableOpacity,
SafeAreaView, // <<< notice the comma here and in the line after
, I18nManager } from 'react-native';
Participation
- I am willing to submit a pull request for this issue.
Additional comments
when adding the airbnb extension it tries to merge both imports
Issue Analytics
- State:
- Created 2 years ago
- Comments:6 (5 by maintainers)
Top Results From Across the Web
eslint --fix breaks code when no-duplicate-imports happens
The issue has been resolved, it was a bug with eslint itself and the latest version (8.11.0) has applied a fix.
Read more >Airbnb JavaScript Style Guide()
Broken strings are painful to work with and make code less searchable. // bad const errorMessage = 'This is a super long error...
Read more >How to set up ES Lint for Airbnb, Vue JS, and VS Code
The fix was simple, and it means babel-eslint parser isn't required unless you are using dynamic imports, in which case babel-eslint parser is...
Read more >eslint-config-eslint
Contains the ESLint configuration used for projects maintained by the ESLint team. Installation. You can install ESLint using npm: npm install eslint --save-dev....
Read more >node_modules/eslint/CHANGELOG.md · master · tbrousso ...
b5bde06 Fix: --rulesdir option didn't work (fixes #11888) (#11890) (Toru Nagashima) · 13f0418 Fix: improve error message on --print-config (fixes ...
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
This is exactly what happens.
With this configuration:
and this code:
the two rules produce the following fixes:
"fix":{"range":[106,106],"text":","}}
"fix":{"range":[107,173],"text":", I18nManager } from 'react-native';\n"}}
Since the ranges are not overlapping, both fixes will be applied in the same pass:
That results in two commas, which is a parsing error. I made a PR to fix this in comma-dangle: https://github.com/eslint/eslint/pull/15669
Thanks for the info!
I thought it’s a bug in a plugin rule
import/no-duplicates
, but this may be a case where two rules produce valid fixes that result in an invalid code when they’re applied together. I’ll investigate further.