Sorry if this has been asked before, but I have a problem with writing JSX and ReactJS code and it not rendering in my CodePen window.
I wrote my code in Visual Studio Code locally and transferred it onto the CodePen pen. I ran it successfully using create-react-app and made sure there were no errors, but when transferring it to CodePen, nothing renders or I get a message saying “Uncaught Reference Error: React is not defined” at my class App extends React.Component {} line. I used the correct import statements and ensured that the structure of the code is almost entirely similar to the example apps provided. Yet, there seems to be no solution.
First, you’re missing ReactDOM import.
Second, it should be React with capital R.
Third, if you open dev console and check the error you’ll see that copy package couldn’t be loaded because of:
/*
* [Package Error] [Package Error] "fs" does not exist. (Imported by "node:fs").
*
* The package "node:fs" depends on this Node.js built-in module.
* Node.js built-in modules (like "fs", "http", etc.) are Node.js-specific, and do
* not exist in non-Node environments like Deno or the web browser. Skypack CDN polyfills
* most of these modules for you automatically, but this one could not be polyfilled.
*
* How to fix:
* - Let the package author know that you'd like to run their package in the browser.
* - Use https://pika.dev/ to find a web-friendly alternative to find another package.
*/