Enable linter rules to use `useEffect` instead of `React.useEffect` (named export instead of full export)

Question

In our codebase we always wanna use

import { useEffect } from 'react';

instead of

import React from 'react';
// use in code as `React.useEffect`

Is it possible to achieve it with eslint longer rules? If yes then how?

Are there existing solutions? And if there isn't existing solution then how to write a custom one?

We wanna use such rules only for the react dependency.

So, what's stopping you from using import { useEffect } from 'react';? — Andy
– Andy, Commented Apr 7, 2023 at 13:55

Jerryh001 · Accepted Answer · 2023-04-07 14:37:48Z

8

use no-restricted-imports to limit the import of React (default):

"no-restricted-imports": [
  "error",
  {
    "paths": [
      {
        "name": "react",
        "importNames": ["default"],
        // "message": "some messages for who import 'React' accidentally"
      }
    ]
  }
],

answered Apr 7, 2023 at 14:37

Jerryh001

1,0024 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Enable linter rules to use `useEffect` instead of `React.useEffect` (named export instead of full export)

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related