1

Имеется HTML:

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

  <script src="https://unpkg.com/react@15/dist/react.js"></script>
  <script src="https://unpkg.com/react-dom@15/dist/react-dom.js"></script>

  <script src="https://unpkg.com/babel-standalone@6/babel.js"></script>

        <script src="/r/b2b-spa/js/main.js"></script>

  <title>Тайтл</title>
</head>
<body>

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

</body>
</html>

Код файла /r/b2b-spa/js/main.js:

import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(
<h1>Hello, world!</h1>, document.getElementById('root')
);

В первой же строке main.js происходит ошибка:

Uncaught SyntaxError: Unexpected token import

Подскажите новичку, как правильно подключить к странице React JS.

1
  • вкратце: конструкции import из коробки - еще не существует. В примерах которые Вы смотрите разработчики уже повозились над тем чтобы она у них была. 18 янв 2017 в 13:40

2 ответа 2

1

Если вы хотите пользоваться импортом/экспортом, то вам надо настроить какой-нибудь сборщик проектов для работы с import/export (es6) + очевидно, для трансляции jsx в js. В случае, когда вы подключаете react через тег , вам не нужно его еще раз импортировать, можно сразу пользоваться:

ReactDOM.render(
  <h1>Hello, world!</h1>,
  document.getElementById('root')
);
1

Вам не нужен импорт, у вас уже по cdn подключены библиотеки, можете вообще стереть и оставить рендер - он должен работать. Но перед этим babel вам может ошибку выдавать, так как вы тип не указали, у вас:

<script src="/r/b2b-spa/js/main.js"></script>

Нужно:

<script type="text/babel" src="/r/b2b-spa/js/main.js"></script>

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.