Hola chicos, soy nuevo en Reactjs, puedo ejecutar <h1>Hello World </h1> en App.js. Pero cuando uso <Container></Container> en Reactstrap aunque haya hecho todas las importaciones, aparece una página en blanco en el navegador. App.js no se procesa cuando uso <Container></Container> . Tampoco recibo ningún error.
App.js => renderizado
import React, { Component } from 'react'; import { Container, Row } from 'reactstrap'; import './App.css'; class App extends Component { render() { return ( <div className="App"> <h1>Hello World</h1> </div> ); } } export default App;App.js => no renderizado
import React, { Component } from 'react'; import { Container, Row } from 'reactstrap'; import './App.css'; class App extends Component { render() { return ( <div className="App"> <Container> <h1>Hello World</h1> </Container> </div> ); } } export default App;índice.js
import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; import './index.css'; import 'bootstrap/dist/css/bootstrap.min.css'; ReactDOM.render( <App />, document.getElementById('root') );paquete.json
{ "name": "test-react-app", "version": "0.1.0", "private": true, "dependencies": { "bootstrap": "^5.1.3", "react": "^17.0.2", "react-dom": "^17.0.2", "react-scripts": "0.9.5", "reactstrap": "^9.0.1" }, "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test --env=jsdom", "eject": "react-scripts eject" } }Hey, aquí parece que react-scripts es una versión baja. Lo actualicé a 4.0.0 y agregué lo siguiente en package.json
, "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 1 safari version" ] }Problema resuelto, gracias.