O meu simplesmente não exibe nada. Devo fazer algum pip install ?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Prompt:wght@400;500;600&display=swap" rel="stylesheet">
<link rel="stylesheet" href="./styles/styles.css" />
<link rel="stylesheet" href="./styles/PaginaDeLogin.css" />
<link rel="stylesheet" href="./styles/CampoDeDigitacao.css" />
<title>Login | CodeConnect</title>
</head>
<body>
<div id="root"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/18.3.1/cjs/react.production.min.js" integrity="sha512-wGcZXj/wGy0PrK1PUJpABds0CNVMN5FOvx6RJ4VFX6d1cP21LHdn32pqqHZxnlAyTY3MN6agJQnV/RkWiOTZzw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/18.3.1/cjs/react-dom.production.min.js" integrity="sha512-JNrK0svSdzmupRoUCGrnD5Im9ybaQ/dtwjbEE8top7nLk6qlV6jatbUinWJf1B+//gADpfBVm8nF1eyreAJX3w==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/7.24.6/babel.min.js" integrity="sha512-os/eJfiEDJeFFDqQb5IUxUBIb1QBNE3vpk/6b3/09h/7etB96cuuaLXo6VuVr+WwXgSD2NbErw80FYLi/hSy6Q==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script type="text/babel">
function Titulo(){
return (
<h1 className="form__titulo">Login</h1>
)
}
function Subtitulo(){
return (
<h2 className="form__texto">Boas-vindas! Faça seu login.</h2>
)
}
function PaginaLogin(){
return (
<div className="container-login">
<img src="./img/imagem-login.png" alt="">
<section>
<form action="">
<Titulo />
<Subtitulo />
</form>
</section>
</div>
)
}
RectDOM.createRoot(document.getElementById("root")).render(<PaginaLogin/>)
</script>
</body>
</html>
