Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.

Problem

I have the following code in the App.js file of my React Js application.

import MyComp from "./components/MyComp";
function App() {
  return 
  (
    <div>
    <h1>My Component</h1>
   <MyComp/>
   </div>
  );
}

export default App;

When I run the project, I get the following error.  

Error: App(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.

 

Solution

This error is shown when you have the return statement and the parenthesis on separate lines. The issue will be fixed when you have the return statement and the parenthesis on the same line as given below. 

function App() {
  return (
    <div>
    <h1>My Component</h1>
   <MyComp/>
   </div>
  );
}

Note that the above code has "return (" on the same line 


Search