fix(lint): typescript requires special no-shadow #238

mikehardy · 2021-11-28T20:34:22Z

In pure javascript eslint config from @react-native-community, the no-shadow rule is on,
which is good, but for typescript it generates false-positives and needs a specific configuration change
to use a typescript-specific rule

Reference:

In pure javascript eslint config from `@react-native-community`, the no-shadow rule is on, which is good, but for typescript it generates false-positives and needs a specific configuration change to use a typescript-specific rule Reference: - https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/docs/rules/no-shadow.md - typescript-eslint/typescript-eslint#2552 (comment)

Hopefully integrates via PR upstream in `@react-native-community`, this appears to be the standard configuration for no-shadow in typescript projects, see: react-native-community/react-native-template-typescript#238

Summary: ESLint configuration is derived from `react-native/eslint-config`, which has supported Flow, vanilla JS, and TypeScript. react-native-community/react-native-template-typescript#238 and a related PR ended up adding new rules to the TypeScript config, to fix bugs with TS linting. It required a followup change, to specify the parser/plugin, and explicity reference them as devDependencies. react-native-community/react-native-template-typescript#240 `react-native/eslint-config` already includes setting the plugin/parser. But overriding rules requires declaring that again, and directly referencing a plugin means a need for the app to declare dependencies, since ESLint resolves modules from the current config. The rules overridedn were later fixed in `react-native/eslint-config`, which is really the right place for the fix (e.g. facebook#32644). I noticed this when deriving from the TS template in facebook#32644 and removed the rule overrides, but didn't have the historical context to realize this means we can then: 1. Remove the explicit parser/plugins since `react-native/eslint-config` already sets them, and we are no longer overriding any rules. 2. Remove the devDependencies, to let the versions be managed entirely by `react-native/eslint-config`. Changelog: [General][Changed] - Simplify Template ESLint Configuration Differential Revision: D41652699 fbshipit-source-id: 67620f12f8fa0ec94fc4db2cbbd2a60a62b70874

Summary: Pull Request resolved: #35529 ESLint configuration is derived from `react-native/eslint-config`, which has supported Flow, vanilla JS, and TypeScript. react-native-community/react-native-template-typescript#238 and a related PR ended up adding new rules to the TypeScript config, to fix bugs with TS linting. It required a followup change, to specify the parser/plugin, and explicity reference them as devDependencies. react-native-community/react-native-template-typescript#240 `react-native/eslint-config` already includes setting the plugin/parser. But overriding rules requires declaring that again, and directly referencing a plugin means a need for the app to declare dependencies, since ESLint resolves modules from the current config. The rules overridedn were later fixed in `react-native/eslint-config`, which is really the right place for the fix (e.g. #32644). I noticed this when deriving from the TS template in #32644 and removed the rule overrides, but didn't have the historical context to realize this means we can then: 1. Remove the explicit parser/plugins since `react-native/eslint-config` already sets them, and we are no longer overriding any rules. 2. Remove the devDependencies, to let the versions be managed entirely by `react-native/eslint-config`. Changelog: [General][Changed] - Simplify Template ESLint Configuration Reviewed By: cortinico Differential Revision: D41652699 fbshipit-source-id: 8e3313dbf27407c5866f3c2432cffc2ecec1b01d

Summary: Pull Request resolved: #35529 ESLint configuration is derived from `react-native/eslint-config`, which has supported Flow, vanilla JS, and TypeScript. react-native-community/react-native-template-typescript#238 and a related PR ended up adding new rules to the TypeScript config, to fix bugs with TS linting. It required a followup change, to specify the parser/plugin, and explicity reference them as devDependencies. react-native-community/react-native-template-typescript#240 `react-native/eslint-config` already includes setting the plugin/parser. But overriding rules requires declaring that again, and directly referencing a plugin means a need for the app to declare dependencies, since ESLint resolves modules from the current config. The rules overridedn were later fixed in `react-native/eslint-config`, which is really the right place for the fix (e.g. #32644). I noticed this when deriving from the TS template in #32644 and removed the rule overrides, but didn't have the historical context to realize this means we can then: 1. Remove the explicit parser/plugins since `react-native/eslint-config` already sets them, and we are no longer overriding any rules. 2. Remove the devDependencies, to let the versions be managed entirely by `react-native/eslint-config`. Changelog: [General][Changed] - Simplify Template ESLint Configuration Reviewed By: cortinico Differential Revision: D41652699 fbshipit-source-id: 8e3313dbf27407c5866f3c2432cffc2ecec1b01d # Conflicts: # template/_eslintrc.js

Summary: Pull Request resolved: facebook#35529 ESLint configuration is derived from `react-native/eslint-config`, which has supported Flow, vanilla JS, and TypeScript. react-native-community/react-native-template-typescript#238 and a related PR ended up adding new rules to the TypeScript config, to fix bugs with TS linting. It required a followup change, to specify the parser/plugin, and explicity reference them as devDependencies. react-native-community/react-native-template-typescript#240 `react-native/eslint-config` already includes setting the plugin/parser. But overriding rules requires declaring that again, and directly referencing a plugin means a need for the app to declare dependencies, since ESLint resolves modules from the current config. The rules overridedn were later fixed in `react-native/eslint-config`, which is really the right place for the fix (e.g. facebook#32644). I noticed this when deriving from the TS template in facebook#32644 and removed the rule overrides, but didn't have the historical context to realize this means we can then: 1. Remove the explicit parser/plugins since `react-native/eslint-config` already sets them, and we are no longer overriding any rules. 2. Remove the devDependencies, to let the versions be managed entirely by `react-native/eslint-config`. Changelog: [General][Changed] - Simplify Template ESLint Configuration Reviewed By: cortinico Differential Revision: D41652699 fbshipit-source-id: 8e3313dbf27407c5866f3c2432cffc2ecec1b01d

mikehardy requested review from emin93 and radko93 as code owners November 28, 2021 20:34

mikehardy requested a review from luancurti November 28, 2021 20:48

emin93 approved these changes Nov 29, 2021

View reviewed changes

emin93 merged commit a67375c into main Nov 29, 2021

emin93 deleted the mikehardy-eslint-no-shadow branch November 29, 2021 07:43

friederbluemle mentioned this pull request Dec 16, 2021

Fix ESLint setup #240

Merged

friederbluemle mentioned this pull request Jan 20, 2022

Update ESLint config #242

Merged

NickGerleman mentioned this pull request Dec 1, 2022

Simplify Template ESLint Configuration facebook/react-native#35529

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fix(lint): typescript requires special no-shadow #238

fix(lint): typescript requires special no-shadow #238

mikehardy commented Nov 28, 2021

fix(lint): typescript requires special no-shadow #238

fix(lint): typescript requires special no-shadow #238

Conversation

mikehardy commented Nov 28, 2021