Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Bug: [eslint-plugin-react-hooks] recommended config rules did not work

See original GitHub issue

Since the latest plugin version (2.5.0) there should be a recommended config for eslint-plugin-react-hooks.

See: https://github.com/facebook/react/tree/master/packages/eslint-plugin-react-hooks PR: #14762

Unfortunately this config did not work. I’am pretty sure the bundled index.js did not include the expected code.

eslint version: 6.8.0 eslint-plugin-react-hooks version: 2.5.0

Steps To Reproduce

Link to code example:

https://github.com/bobaaaaa/eslint-plugin-react-hooks-err

The current behavior

Oops! Something went wrong! :(

ESLint: 6.8.0.

ESLint couldn't find the config "plugin:react-hooks/recommended" to extend from. Please check that the name of the config is correct.

The config "plugin:react-hooks/recommended" was referenced from the config file in "${projectDir}/eslint-plugin-react-hooks-err/.eslintrc.json".

If you still have problems, please stop by https://gitter.im/eslint/eslint to chat with the team.

error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

The expected behavior

yarn exit code 0

Issue Analytics

State:
Created 4 years ago
Reactions:5
Comments:5 (2 by maintainers)

Top GitHub Comments

7reactions

Bluefitdevcommented, May 13, 2020

Hey Guys, weirdly i’m still having this error right now

module.exports = {
    env: {
        browser: true,
        es6: true
    },
    extends: [
        "plugin:react/recommended",
        "airbnb",
        "plugin:react-hooks/recommended",
        "prettier"
    ],
    globals: {
        Atomics: "readonly",
        SharedArrayBuffer: "readonly"
    },
    parserOptions: {
        ecmaFeatures: {
            jsx: true
        },
        ecmaVersion: 2018,
        sourceType: "module"
    },
    plugins: ["react", "jsx-a11y", "import", "prettier"],
    rules: {
        "prettier/prettier": "error",
        "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
        "react/require-default-props": [0],
    }
};

That’s my eslintrc, just installed the hooks plugin today

version: "eslint-plugin-react-hooks": "^4.0.1",

Anything I should be aware of?’

EDIT:

Sorry i just realised that airbnb is using react hooks 2.5

7reactions

threepointonecommented, Mar 4, 2020

The commit that landed that behaviour (https://github.com/facebook/react/pull/14762) hasn’t been released yet. We could probably do a release sometime, but the workaround right now is to copy paste the recommended config. I’ll leave this open till we do.

Top Results From Across the Web

Why eslint-plugin-react-hooks doesn't warn when using react ...

If I use hooks conditionally in custom hooks, there will be a warning like this: "React Hook \"useState\" is called conditionally. React Hooks...

eslint-plugin-react-hooks - npm

eslint -plugin-react-hooks. This ESLint plugin enforces the Rules of Hooks. It is a part of the Hooks API for React.

Invalid Hook Call Warning - React

There are three common reasons you might be seeing it: You might have mismatching versions of React and React DOM. You might be...

Basic Features: ESLint - Next.js

Recommended rule -sets from the following ESLint plugins are all used within eslint-config-next : eslint-plugin-react · eslint-plugin-react-hooks · eslint-plugin ...

eslint/eslint - Gitter

This can happen for a couple different reasons: 1. If ESLint is installed globally, then make sure eslint-plugin-react-hooks is also installed globally.