Не отображается содержимое и сам элемент <script> во вкладке Elemets

100

11 августа 2021, 23:00

Изучая туториал по react столкнулся с проблемой после подключения

npx create-react-app my-app
cd my-app 
npm start

В браузере на вкладке Elemets пропал элемент <script> с блоками кода. Вместо этого я вижу эту надпись (npm run build не помог):

This HTML file is a template. If you open it directly in the browser, you will see an empty page.

You can add webfonts, meta tags, or analytics to this file. The build step will place the bundled scripts into the tag.

To begin the development, run npm start or yarn start. To create a production bundle, use npm run build or yarn build.

И ничего не выводится во вкладке console

Answer 1

Create React App — удобная среда для изучения React и лучший способ начать создание нового одностраничного приложения на React.

Инструмент настраивает среду для использования новейших возможностей JavaScript, оптимизирует приложение для продакшена и обеспечивает комфорт во время разработки. Вам понадобятся Node.js не ниже версии 8.10 и npm не ниже версии 5.6 на вашем компьютере. Для создания проекта выполните команды:

npx create-react-app my-app
cd my-app
npm start

Пошагово это выглядит следующим образом. Создаем React приложение (с помощью выполнения команды npx create-react-app my-app):

Далее идем в каталог созданного приложения (команда cd my-app) и смотрим, что лежит в папке (опциональный пункт, команда ls):

Далее запуск приложения (команда npm start или yarn start - кому как удобнее), приложение будет запущено на 3000 порту:

В браузере по-умолчанию должна открыться страница приложения (по адресу http://localhost:3000/):

В разметке будет всё по дефолту, смотрим следующее изображение:

Этот HTML-файл, который отображается на странице в браузере - является шаблоном (лежит в папке public вашего проекта и называется index.html). Вы можете добавить в этот файл веб-шрифты, метатеги или аналитику. Всё, что касается React - попадает в тэг с идентификатором root. В каталоге src лежит компонент App.js из которого рендерится содержимое в div с айдишником root. Всё просто.