I am getting an error that says - " 'useEffect' is assigned a value but never used no-CodePudding

Below is the part of the code of the file that generates the error, tried changing something in eslintrc plugins but didn't work out. Please help!!

import React, { useState, useEffect } from "react";
import { Link, useHistory, useLocation } from "react-router-dom";
import { useDispatch } from "react-redux";
import { AppBar, Typography, Toolbar, Button, Avatar } from "@material-ui/core";
import memories from "../../images/memories.png";
import useStyles from "./styles";

const Navbar = () => {
  const classes = useStyles();
  const [user, setUser] = useState(JSON.parse(localStorage.getItem("profile")));
  const dispatch = useDispatch();
  const history = useHistory();
  const location = useLocation();

  const logout = () =>{
    dispatch({type:'LOGOUT'});
    history.push('/');
    setUser(null);
  }

  useEffect =
    (() => {
      const token = user?.token;
      setUser(JSON.parse(localStorage.getItem("profile")));
    },[location]);

CodePudding user response：

ESLint behavior looks right to me. You've imported "useEffect" but never used in your application. It should disappear if you use it or remove the import from the "import React, { useState, useEffect } from "react";"

CodePudding user response：

Add comments after the Error statement.

// eslint-disable-line no-unused-vars

If your problem doesn't solved after that then 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'
]