Discussion: errors from new rules when updating eslint-config-airbnb to v19

[lindapaiste]

Increasing Access

It's good to keep all of our dependencies updated to their latest versions.

Feature enhancement details

We us the eslint-config-airbnb package to define a lot of our code style rules. We are currently on version 16.1.0. I would like to update this to the latest version 19.0.4. This update changes a lot of rules and introduces LOTS of linting errors into the codebase:

✖ 1321 problems (1320 errors, 1 warning)
273 errors and 0 warnings potentially fixable with the --fix option.

For each rule, we have 3 options:

1. If we don't like the rule: Override the rule in our .eslintrc config to allow the current code.
2. If we do like the rule: Keep the rule and fix the code (sometimes possible with lint-fix command).
3. If we do like the rule, but don't want to deal with right away: Adjust the rule in our .eslintrc to downgrade errors to warnings.

My plan right now is to update the package but add exemptions for all of the rules (option 1).

I don't like to change to much in a single PR so my plan is to address desirable rules (option 2) individually. For example I think that no-useless-catch is a good rule which we should use so I put in PR #2212 to fix the code.

Here are examples of all of the new errors:

Message	Rule
Default parameters should be last	default-param-last
Dependency cycle detected	import/no-cycle
Cannot use import declarations in modules that export using CommonJS (module.exports = 'foo' or exports.bar = 'hi')	import/no-import-module-exports
Useless path segments for "../../IDE/actions/console", should be "../actions/console"	import/no-useless-path-segments
A control must be associated with a text label	jsx-a11y/control-has-associated-label
A form label must be associated with a control	jsx-a11y/label-has-associated-control
Expected blank line between class members	lines-between-class-members
File has too many classes (2). Maximum allowed is 1	max-classes-per-file
Unnecessary 'else' after 'return'	no-else-return
The members of 'FileActions' are read-only	no-import-assign
Return values from promise executor functions cannot be read	no-promise-executor-return
'default' is restricted from being used as an exported name	no-restricted-exports
Unnecessary try/catch wrapper	no-useless-catch
Use an object spread instead of Object.assign eg: {...foo }	prefer-object-spread
Missing an explicit type attribute for button	react/button-has-type
Must use destructuring state assignment	react/destructuring-assignment
Must use destructuring props assignment	react/destructuring-assignment
Function component is not a function declaration	react/function-component-definition
Unexpected newline before '}'	react/jsx-curly-newline
Prefer fragment shorthand over React.Fragment	react/jsx-fragments
JSX props should not use functions	react/jsx-no-bind
Fragments should contain more than one child - otherwise, there’s no need for a Fragment at all	react/jsx-no-useless-fragment
+ must be placed on a new line	react/jsx-one-expression-per-line
Prop spreading is forbidden	react/jsx-props-no-spreading
Missing parentheses around multilines JSX	react/jsx-wrap-multilines
Use callback in setState when referencing the previous state	react/no-access-state-in-setstate
componentWillReceiveProps is deprecated since React 16.9.0, use UNSAFE_componentWillReceiveProps instead, see https://reactjs.org/docs/react-component.html#unsafe_componentwillreceiveprops. Use https://github.com/reactjs/react-codemod#rename-unsafe-lifecycles to automatically update your components	react/no-deprecated
componentWillMount is deprecated since React 16.9.0, use UNSAFE_componentWillMount instead, see https://reactjs.org/docs/react-component.html#unsafe_componentwillmount. Use https://github.com/reactjs/react-codemod#rename-unsafe-lifecycles to automatically update your components	react/no-deprecated
Unused method or property "node" of class "NavBasic"	react/no-unused-class-component-methods
autosaveInterval should be placed before componentDidUpdate	react/sort-comp
'defaultProps' should be declared outside the class body	react/static-property-placement