useEffect传递的空数组，为什么初始化的时候调用了两次

这是我的代码：

import React, { useEffect } from 'react'
import './scss/MyScene.scss'
import Three from '@/common/three'

export default function MyScene() {
    var three;

    useEffect(() => {
        three = new Three('my_scene')
        console.log(three)
    }, [])
    return (
        <div id='my_scene'></div>
    )
}

看起来这个代码中，应该会执行一次打印语句。但是实际上却执行了两次。

 在React中，useEffect 钩子可能会执行两次的原因通常与React的严格模式（Strict Mode）有关。React的严格模式是一种开发工具，用于突出显示应用程序中的潜在问题。在开发模式下，严格模式会故意重复调用某些函数，以帮助开发者发现意外的副作用。

因此，只需要回到main.jsx中去掉StrictMode标签就可以解决了。