useEffect not rendering page

Support
1

Site name: youthful-davinci-bbeffe.netlify.app/

When I use a useEffect statement my page fails to load.

import { useEffect } from 'react/cjs/react.development';

function App() {

  useEffect(() => {
    const loadLeads = () => {
      console.log("bla bla bla")
    }
    loadLeads();
  }, []); 

  console.log("Now displaying hello wold");

  return (
    <div className="container py-5">
      <h1 className="text-center mb-5">Hello World</h1>
    </div>
  );
}

export default App;

No console messages from the code run. I get the following error messages. If I remove the useEffect everything runs ok.

Begin Error Messagees
ypeError: Object(…) is not a function
at i (main.2cf4593d.chunk.js:1)
at ro (2.347b8e2c.chunk.js:2)
at Hu (2.347b8e2c.chunk.js:2)
at Pi (2.347b8e2c.chunk.js:2)
at xi (2.347b8e2c.chunk.js:2)
at _i (2.347b8e2c.chunk.js:2)
at vi (2.347b8e2c.chunk.js:2)
at fi (2.347b8e2c.chunk.js:2)
at Gi (2.347b8e2c.chunk.js:2)
at 2.347b8e2c.chunk.js:2
uu @ 2.347b8e2c.chunk.js:2
n.callback @ 2.347b8e2c.chunk.js:2
fa @ 2.347b8e2c.chunk.js:2
hu @ 2.347b8e2c.chunk.js:2
Li @ 2.347b8e2c.chunk.js:2
t.unstable_runWithPriority @ 2.347b8e2c.chunk.js:2
$l @ 2.347b8e2c.chunk.js:2
Ti @ 2.347b8e2c.chunk.js:2
vi @ 2.347b8e2c.chunk.js:2
fi @ 2.347b8e2c.chunk.js:2
Gi @ 2.347b8e2c.chunk.js:2
(anonymous) @ 2.347b8e2c.chunk.js:2
yi @ 2.347b8e2c.chunk.js:2
rs @ 2.347b8e2c.chunk.js:2
t.render @ 2.347b8e2c.chunk.js:2
11 @ main.2cf4593d.chunk.js:1
l @ (index):1
t @ (index):1
r @ (index):1
(anonymous) @ main.2cf4593d.chunk.js:1
2.347b8e2c.chunk.js:2 Uncaught TypeError: Object(…) is not a function
at i (main.2cf4593d.chunk.js:1)
at ro (2.347b8e2c.chunk.js:2)
at Hu (2.347b8e2c.chunk.js:2)
at Pi (2.347b8e2c.chunk.js:2)
at xi (2.347b8e2c.chunk.js:2)
at _i (2.347b8e2c.chunk.js:2)
at vi (2.347b8e2c.chunk.js:2)
at fi (2.347b8e2c.chunk.js:2)
at Gi (2.347b8e2c.chunk.js:2)
at 2.347b8e2c.chunk.js:2
i @ main.2cf4593d.chunk.js:1
ro @ 2.347b8e2c.chunk.js:2
Hu @ 2.347b8e2c.chunk.js:2
Pi @ 2.347b8e2c.chunk.js:2
xi @ 2.347b8e2c.chunk.js:2
_i @ 2.347b8e2c.chunk.js:2
vi @ 2.347b8e2c.chunk.js:2
fi @ 2.347b8e2c.chunk.js:2
Gi @ 2.347b8e2c.chunk.js:2
(anonymous) @ 2.347b8e2c.chunk.js:2
yi @ 2.347b8e2c.chunk.js:2
rs @ 2.347b8e2c.chunk.js:2
t.render @ 2.347b8e2c.chunk.js:2
11 @ main.2cf4593d.chunk.js:1
l @ (index):1
t @ (index):1
r @ (index):1
(anonymous) @ main.2cf4593d.chunk.js:1

2

This has been resolved. The issue was with the import statement. The problem code used import { useEffect } from ‘react/cjs/react.development’, it should have been import { useEffect } from ‘react’

1 Like
3

Hey there, @chuckbelcher :wave:

Thanks so much for circling back and letting us know! This will be beneficial to future Forums members who encounter something similar.