Estoy siguiendo los pasos en https://reactjs.org/docs/add-react-to-a-website.html para agregar React a un sitio web existente. El proceso consiste en agregar los scripts:

 <script src="https://unpkg.com/react@17/umd/react.production.min.js" crossorigin></script> <script src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js" crossorigin></script>

Luego, habilitando JSX instalando Babel:

 npm init -y npm install babel-cli@6 babel-preset-react-app@3

Finalmente, ejecutando Babel:

 npx babel --watch src --out-dir . --presets react-app/prod

Estos pasos funcionan muy bien, pero si hay un error de sintaxis en cualquiera de los archivos JSX en src , Babel no podrá transpilar el archivo JSX y el archivo JS transpilado nunca se escribirá, por lo que no puedo depurar el problema. Además, si hay un error de tiempo de ejecución en el archivo JS transpilado, Google Chrome Developer Console mostrará los errores del archivo JS transpilado resultante, y no el archivo JSX original. ¿Cuál es la forma más sencilla de que aparezcan los errores de sintaxis/tiempo de ejecución de JSX en Google Chrome Developer Console?