React assigned value but never used in an unexisting file

Question

Im using create-react-app to make my aplication. After I save the files to compile the terminal throws the folowing error: src\App.js Line 37:21: 'setOpenModal' is assigned a value but never used no-unused-vars

src\App\App.js Line 37:21: 'setOpenModal' is assigned a value but never used no-unused-vars

the thing is, the file App.js I moved to a file called App and changed the name to index.js. Also I sent the variable setOpenModal to a element like so:

src/App/index.js:

  const [openModal, setOpenModal] = React.useState(false);

  return (
    <AppIU
      doc_type={doc_type}
      date={date}
      course={course}
      openModal={openModal}
      setOpenModal={setOpenModal}
    />
  );

the function setOpenModal is actually being used in another file and I pass the fuction through props. is there a way to make react realice that the variable is being used and that the file src/App.js no longer exists??

I've tried just saving again the file to compile it again expecting the warnig to just go away but it persists. Ive also tryed adding the /* eslint-disable no-unused-vars / and / eslint-enable no-unused-vars */ before and after declerign the const but it still does not remove the warning. Also I would like to not jus disable the warnings as I have a tendency to forget about decleared variables :v

When this happens to me, I usually just shut down the server, close the project and restart my editor. It doesn't happen often, but sometimes webpack just borks. — jme11, Jan 13 '23 at 20:32
The error isn't pointing to the code sample you added, can you show what's in `App.js` on the referenced line? This linter rule is warning you, when you declare (declare, import, destructure, etc) a name, and you are not using it. It doesn't do any further checks, if the given value is actually being used elsewhere. — Balázs Édes, Jan 13 '23 at 20:34

score 1 · Answer 1 · answered Jan 13 '23 at 21:58

1

I'd shutdown the server, delete the cache and build files, and then start the development server again.

answered Jan 13 '23 at 21:58

Ahmed Serag

11
2

score 0 · Answer 2 · answered Jan 16 '23 at 14:19

There was the answer for your issue:

First, install the following module npm install --save-dev eslint-plugin-react.

Then, in your .eslintrc.json, under extends, include the following plugin:

'extends': [
    'plugin:react/recommended'
]

ESLint with React gives `no-unused-vars` errors

React assigned value but never used in an unexisting file

2 Answers2