Почему не работает React-проект посли заливки на хостинг?

Question

[petrro]

Первый раз закидываю React-сайт на хостинг. Раньше забрасывал сайты написаные на чистом JS и все было ок. Забросил React сайт на хостинг my.aiwebhost.com.
И вместо сайта у меня вот что:

Думаю возможно причина в том что index.js находится в папке src, а не в главной папке, изначально npm при создании проекта забросил index.js в папку src. Я попробовал переместить файл index.js в главную папку проекта, и теперь у меня вот что отображается:

Возможно нужны какие-то допольнительние настройки на хостинге? Или как исправить мою проблему?
Или может для react проектов нужны какие-то специальные хостинги?

Answer 1

[Артем]

Когда ваше приложение готово к развёртыванию в продакшене, запуск команды npm run build создаст оптимизированную сборку вашего приложения в папке build.

reactjs.org

Comments

[petrro]

тоесть мне нужно:
1)в командной строке прописать путь к папке моего приложения
2)прописать npm run build
3) перезалить папку с проектом на хостинг
правильно?

[Артем]

в каталоге с проектом npm run build, появиться каталог build, его содержимое на сервер (там будет index.html)

[Артем]

те не нужно тянуть на сервер весь проект, а только содержимое build

[petrro]

Артем, тоесть из папки сайта на хостинге удалить все( node modules, public, src) а только закинуть папку build и все будет работать?
Или вы имели ввиду не перезаливать файлы а только добавить папку build к залитым уже на хостинг файлам?

[Сергей delphinpro]

petrro, не папку build, а ее содержимое! Разные вещи =) Всё остальное удалить нафиг.

[Владимир]

petrro, это не ответ. Но неплохо было бы изучить документацию к реакт и про nodejs заодно.

[Владимир]

Сергей delphinpro, стоило бы уточнить, что удалить всё с хостинга. А то сейчас удалит все кроме папки build.

Answer 2

[Арман Дендибаев]

1) пишешь npm run build
2) Все файлы из папки build кидаешь в корень (хостинг)

Answer 3

[Владимир Петрозаводский]

Именно ПосЛИ заливки не работает? А до надо по дорогать вы его так же открыли именно index.js в браузере а не готовый билд и не dev сервер и при этом работало ? Если нет то может он не ПосЛИ заливки перестал работать

Answer 4

[sidorovkv]

В зависимости от настройки npm-скриптов и вашего сборщика команды из прошлых ответов могут не работать. Если я правильно понимаю, то ваш сборщик собирает бандл в папку public (и там же лежит ваш index.html) и именно ее содержимое нужно выгружать на хостинг. Весь прочий код до сборки не нужен, потому что сборщик все равно собирает его в бандл. Самое главное чтобы именно index.html лежал в корне, сервер по умолчанию отправляет именно его браузеру, после чего браузер выкачивает все файлы, которые описаны в индексном файле.