How to React to use in HTML

Disclaimer: This article is a blogger original article, shall not be reproduced without the bloggers allowed. https://blog.csdn.net/zhonghua_csdn/article/details/90815860

How to React to use in html, that is, how to use the CND react in a static html and using React.
Introduction of methods:
add the CDN in the Head:

    <script src="https://unpkg.com/react@16/umd/react.development.js"></script>
    <script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
    <script src="https://unpkg.com/[email protected]/babel.js"></script>

React use development:

<body>
        <div id="root"></div>

        <script type="text/babel">
          class App extends React.Component {
            render() {
              return <h1>Hello world!</h1>
            }
          }
          ReactDOM.render(<App />, document.getElementById('root'))
        </script>
</body>

result:


2789632-4229c86a7d4fb0b6.png

note:

  1. This method is not recommended, it is recommended to use Node.js, webpack React to build the project.
  2. type attribute <script> tag is text / Babel . This is because React unique JSX grammar, is not compatible with JavaScript. Any use of JSX place, we must add type = "text / babel".

Guess you like

Origin blog.csdn.net/zhonghua_csdn/article/details/90815860