Soy bastante nuevo en React y he estado tratando de configurar una aplicación REACT. Sin embargo, siempre obtengo una página en blanco. ¿Alguien puede ayudar?
Código HTML (index.html)
<html> <head> <meta charset="UTF-8" /> <title>Home</title> </head> <body> <div id="root"></div> <script src="index.js" type="text/babel"></script> </body> </html>Javascript (index.js)
import React from "react" import ReactDOM from "react-dom" const page = ( <div> <h1>My page</h1> </div> ) ReactDOM.render(page, document.getElementById("root"));Y sí, estoy usando un servidor en vivo para ejecutar este código.
Los navegadores no entienden el tipo MIME de text/babel .
Está ahí para que Babel busque en el DOM los scripts que debería procesar para convertirlos de lo que sean (JS + JSX en este caso) a JS.
Sin embargo, no has incluido a Babel en tu página.
Tiene un problema adicional en el sentido de que dentro de su secuencia de comandos tiene declaraciones de import que dependen de la resolución del módulo Node.js (y está usando un navegador, no Node).
Debes empezar por el principio de la guía de React .
Actualmente tiene una combinación extraña de aproximadamente el 20 % de la guía rápida para agregar React a un sitio web y el 5 % del uso de una cadena de herramientas basada en Node.js para transpilar su código .
Recomiendo comenzar con create-react-app , ya que le brinda una base sólida y eficaz para comenzar.