Вот несколько способов использования React DOM и Babel через CDN:

<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.13.1/umd/react-dom.production.min.js"></script>

Далее подключите библиотеку Babel для транспиляции вашего JSX-кода:

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.26.0/babel.min.js"></script>

Атрибут типа

для тега сценария. Это позволяет Babel транспилировать код JSX на лету. Вот пример:

<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.13.1/umd/react-dom.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.26.0/babel.min.js"></script>
<script type="text/babel">
  // Your JSX code here
</script>

Обязательно включите атрибут type="text/babel"в тег скрипта, содержащий ваш код JSX.

Метод 3: операторы импорта с предварительной компиляцией Babel
Если вы используете в своем проекте модули ES, вы можете использовать оператор import, чтобы включить React DOM и Babel. Однако этот метод требует предварительной компиляции кода с помощью Babel перед его отправкой в ​​браузер.

Сначала установите React DOM и Babel в качестве зависимостей в своем проекте, используя npm или Yarn:

npm install react-dom
npm install @babel/standalone

Затем в файле JavaScript импортируйте React DOM и все необходимые компоненты:

import ReactDOM from 'react-dom';
import React from 'react';
// Your code here

Не забудьте предварительно скомпилировать код JavaScript с помощью такого инструмента, как Babel, прежде чем развертывать его в CDN или передавать его со своего собственного сервера.