症状

reactアプリをnpm startしたときに以下のような警告が表示されてしまいました。特に動作に問題ないので放置していたところ、何百行分も出力されるようになってしまったため対処することにしました。

内容を翻訳すると、「「Hoge」は定義されていますが、使用されることはありません」となりました。
どうやら使われない変数だったり、importしたものがあったりすると、親切心からそれを教えてくれるようです。

warn

Line 1:16:  'Hoge' is defined but never used  no-unused-vars

Fuga.jsx

import React,{useState} from "react";
import Hoge from "../Hoge";

export const Fuga = () => {
  const [count,setCount] = useState(0)

  function addCount() {
    setCount(count + 1);
  }

  return (
    <div>
      <button onClick={() => addCount()}>
      {count}
    </div>
  )
}

解決方法

使われていないimportを消したら解決しました。

Fuga.jsx

import React,{useState} from "react";

export const Fuga = () => {
  const [count,setCount] = useState(0)

  function addCount() {
    setCount(count + 1);
  }

  return (
    <div>
      <button onClick={() => addCount()}>
      {count}
    </div>
  )
}