Completé un juego mini connect-4 basado en el tutorial de Tic-tac-toe en el sitio web oficial de Reactjs Código: https://codepen.io/bunansia/pen/KKXXKje?editors=1010 Copié el archivo html, css más JS y intenté ejecutar en VCS pero fallé He instalado node.js, @babel/cli @babel/core @babel/preset-env @babel/preset-react han sido instalados, y así es como se ve mi archivo package.json

 { "name": "react-connect4", "version": "1.0.0", "main": "index.js", "scripts": { "build": "babel src/index.js --out-file public/scripts/index.js", "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC", "dependencies": { "@babel/cli": "^7.16.0", "@babel/core": "^7.16.5", "@babel/preset-env": "^7.16.5", "@babel/preset-react": "^7.16.5" }, "devDependencies": { "@babel/plugin-transform-react-jsx": "^7.16.5" }, "description": "", "plugins": [ [ "@babel/plugin-transform-react-jsx", { "throwIfNamespace": false, // defaults to true "runtime": "automatic", // defaults to classic "importSource": "custom-jsx-library" // defaults to react } ] ] }

También he creado un archivo .babelrc que indica dónde encontrar el ajuste preestablecido

 { "presets": ["@babel/preset-env","@babel/preset-react"] }

He intentado varias formas, como convertir el archivo JS original a la versión babel

 "scripts": { "build": "babel src/index.js --out-file public/scripts/index.js", "test": "echo \"Error: no test specified\" && exit 1" }

Y los puse en la carpeta llamada "public", mientras que los archivos js && css están en la carpeta llamada "script". Pero cuando lo ejecuto en el servidor en vivo, todo está en blanco. ¿Cuáles pueden ser los problemas de configuración?

He agregado 2 líneas en el archivo html ya que también estoy usando estos dos scripts externos

 <script src="https://unpkg.com/react-dom@17.0.2/umd/react-dom.development.js"></script> <script src="https://unpkg.com/react@17.0.2/umd/react.development.js"></script>