Estoy siguiendo este artículo para agrupar mi aplicación de reacción como un solo archivo js que se puede incrustar como un widget en cualquier sitio web.
Aquí hay una versión redactada de mi archivo package.json que muestra los scripts de compilación
"scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject", "build:widget": "parcel build src/index.js --no-source-maps -d widget" //This } Entonces, al ejecutar yarn build:widget , quiero que el paquete construya toda la aplicación en un solo archivo index.js que pueda incrustar en un archivo html normal.
La compilación funcionó, pero el único problema ahora es que recibo el error ReferenceError: React is not defined después de hacer referencia al archivo de salida index.js dentro de mi archivo index.html como se muestra a continuación
<body> <p>Hello World</p> <div id="widget-section"></div> </body> <link href="../index.css" rel="stylesheet" /> <script src="../index.js"></script> //ReferenceError: React is not defined gets thrown here¿Hay un mejor trabajo alrededor de esto?
Incluso si su JavaScript no llama explícitamente a React , es decir, import React from "react" , aún necesita agregar esta importación si está usando JSX. Esto se debe a que su transpilador JSX inserta JSX como llamadas React.createElement .