The useEffect hook is running twice

Question

I have a problem that works as follows, I have a function that it has to be executed within userEffect once, but userEffect always executes twice and I don't know why, I've looked here for many solutions and they all give the same answer which is to use the useEffect parameter so with this [] or use useCallback, but none of the methods worked and I even tested it with something very simple, I'll put the code here.

import React from 'react';

function App() {
  React.useEffect(() => {
    test();
  },[])
  function test (){
    console.log('test')
  }
  return (
    <div>
      Hello
    </div>
  );
}

export default App;

Answer 1

In react 18 if you use StrictMode, useEffect is called twice you can learn more here: https://www.youtube.com/watch?v=j8s01ThR7bQ

Answer 2

As John Kim said above, removing StrictMode from your index.js will do the trick.

Answer 3

this problem cause only in dev env because you are using StrictMode in your index.js