当我尝试向我的网站添加反应时没有任何反应，看起来浏览器没有检测到文件

Question

I am trying to add react to my site but nothing is happening. I can't see where I am going wrong.

The site is built using HTML and I am adding react to it

Here is my code:

<div id="goalsReact"></div>

<!-- Load React. -->
<!-- Note: when deploying, replace "development.js" with "production.min.js". -->
<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 type="text/babel" src="js/goals.js"></script>
<script src="js/scripts.js"></script>
<script type="text/jsx">
    ReactDOM.render(
        <Goals />,
        document.getElementById('goalsReact');
    );
</script>

Answer 1

In order to use JSX in your HTML file, like you're doing, you would need to add babel to transpile your code into regular JavaScript: https://reactjs.org/docs/add-react-to-a-website.html#quickly-try-jsx

Here's a demo: https://codesandbox.io/s/stack-overflow-jsx-in-html-p7nnk?file=/index.html