I'm trying to add react js to a basic web page. This is the file structure:
////
├─index.html
└─js/
├─Page.js
└─index.js
index.html:
<body>
<div id="root"></div>
<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<script src="js/index.js" type="text/babel"> </script>
</body>
index.js:
import ReactDOM from 'react-dom';
import Page from './Page';
ReactDOM.render(<Page />, document.getElementById('root'));
Page.js:
import {Component} from 'react'
class Page extends Component {
render() {
return (
<h1>Hello World!</h1>
)
}
}
export default Page;
For some reason Hello World doesn't appear on the page when I open index.html. How can I fix this page?
Aucun commentaire:
Enregistrer un commentaire