Por favor, estoy tratando de ejecutar la aplicación de reacción usando un CDN externo y tengo problemas en el archivo html que dice:
Error de referencia no capturado: el requisito no está definido index.html:3 Este es el código html:
<!DOCTYPE html> <html> <head> <meta charset='UTF-8'> <link rel="stylesheet" href="styles/style.css"> <script src='https://unpkg.com/react@16.3.1/umd/react.production.min.js'></script> <script src='https://unpkg.com/react-dom@16.3.1/umd/react-dom.production.min.js'></script> <script src='https://unpkg.com/react-router-dom@5.0.0/umd/react-router-dom.min.js'></script> <script src='https://unpkg.com/babel-standalone@6.26.0/babel.js'></script> </head> <body> <div id='root'></div> <script type='text/babel'> import Todo from 'component/Todo.js'; const App = () =>( <div> <h1>My Todos</h1> <Todo /> </div> ) ReactDOM.render(<App />, document.querySelector('#root')); </script> </body> </html>Y este el código JavaScript
function Todo (){ return (<div className="card"> <h2>TITLE</h2> <div className="actions"> <button className="btn">Delete</button> </div> </div>); } export default Todo;puede importar scripts externos desde otro servidor como este:
componentDidMount() { const script = document.createElement("script"); script.src = "/static/libs/your_script.js"; script.async = true; script.onload = () => this.scriptLoaded(); document.body.appendChild(script); }Luego, para asegurarse de que su archivo esté cargado:
scriptLoaded() { // your stuff to do! }Otra forma es usar reaccionar Casco:
primero instálalo usando:
npm install --save react-helmetentonces utilízalo así
<Helmet> <script src="www.test.ts" /> </Helmet> tenga en cuenta que de esta manera su secuencia de comandos se cargará en el <head>