RenderCode: Nothing was returned from render
marchamm opened this issue · comments
Overview
When typing in the editor <Button>Hello</Button>
everything works fine. But when the component name is incomplete or not spelled correctly, eg: <Butto
, <
or <Buton>Hello</Button>
I get an error in the frame and the console:
"RenderCode(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null."
Issue
Complete name | Incomplete name |
---|---|
Setup
I've installed Playroom in a fresh Create React App, created a simple component and have the following configuration to re-create the issue:
playroom.config.js
module.exports = {
components: './src/components',
outputPath: './dist/playroom',
};
src/components/index.js
import React from 'react';
const Button = ({ children }) => <button>{children}</button>;
export { Button };
Here is a link to the Repo: https://github.com/marchamm/cra-playroom
I'm not quite sure what I'm doing wrong, if it's related to CRA or Playroom, or if I'm missing something. So I would really appreciate some guidance and help with troubleshooting by some kind souls.
Note: Thanks for an amazing tool and making it open source 🙏
Edit: Seems related to debajyoti-thetaonelab/the-material-ex-ts#1 and #59 . Happy to close this issue if it is related to webpack config and not Playroom.