Базовая установка React с использованием тега <script> - PullRequest
Новая
       13

Базовая установка React с использованием тега <script>

1 голос
/ 06 мая 2019

Я делаю учебное пособие Баки Роберта (Новый Бостон) по React (гиперссылка в коде ниже).

Я застрял в начале, просто пытаясь установить / загрузить React с тегом вместоиспользования локальных файлов.Я получаю два сообщения об ошибках:

  1. TypeError: t (...). Объект не определен [Узнать больше] browser.min.js: 8: 31612
  2. SyntaxError: ожидаемое выражение, получил '<' [Узнать больше] test.html: 19: 24 </li>

Могу поспорить, что моя проблема довольно проста, но я потратил много времени, пытаясь выяснить, что происходит. 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>

    <!--The tutorial that I'm trying to do https://www.youtube.com/watch?v=2NLgQMs2hOw&list=PL6gx4Cwl9DGBuKtLgPR_zWYnrwv-JllpA&index=2-->
    <script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
    <script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/6.1.19/browser.min.js"></script>

</head>
<body>

    <div id="example"></div>

    <script>
        ReactDOM.render(<h1>test2</h1>, document.getElementById('example'));
    </script>

</body>
</html>

По сути, я просто хочу знать, какой будет версия моего кода без ошибок, чтобы я мог выполнять учебные пособия.

Ответы [ 2 ]

0 голосов
/ 10 мая 2019

После поиска в Интернете и опроса других людей, вот что я нашел.

  1. TypeError: t (...). Объект не определен [Узнать больше] browser.min.js: 8: 31612

Эта проблема связана с предоставленными мною тегами. Я смог решить проблему, используя вместо этого: 

<script src= "https://unpkg.com/react@16/umd/react.production.min.js"></script>
<script src= "https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
<script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>
  1. SyntaxError: ожидаемое выражение, получено '<' [Узнать больше] test.html: 19: 24 </li>

Как было указано: мне не хватало "маркировки" кода с помощью 

<script type="text/babel">

Вот полный код, без двух ошибок, которые у меня были: 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>

    <!--https://reactjs.org/docs/add-react-to-a-website.html-->
    <script src= "https://unpkg.com/react@16/umd/react.production.min.js">                       </script>
    <script src= "https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
    <script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>
</head>
<body>

    <div id="example"></div>

    <script type="text/babel">
        ReactDOM.render(<h1>test2</h1>, document.getElementById('example'));
    </script>

</body>
</html>
0 голосов
/ 06 мая 2019

Ваш элемент скрипта не содержит обычный JavaScript, и вы пропустили атрибут type, чтобы показать, что он содержит.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...