<!Doctype>
<html>
<head>
<meta charset="UTF-8" />
<title>ReactStart</title>
<!-- Загрузим React. -->
<!-- Примечание: для деплоя на продакшен замените окончание «development.js» на «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>
<!-- Для JSX -->
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
</head>
<body>
<div>
<div id="componentJSX"></div>
</div>
<!-- Загрузим наш React-компонент c JSX. (так не работает JSX)-->
<script type="text/babel" src="componentJSX.js"></script>
<!-- А так работает -->
<script type="text/babel" >
ReactDOM.render(<button>start</button>, document.getElementById('componentJSX'))
</script>
</body>
</html>
Вот так не работает, какую то ошибку про CORS выдаёт, но если прям в этом html вставить тег скрипт и в него всё вставить из componentJSX.js, то работает как надо. Почему так? Как подключать компоненты и в них работать с JSX? Без сборщика, это важно.