Как запустить React-приложение на Node.JS?

Question

[ASiD]

Добрый день.
Начал изучать React. Начитавшись всяких мануалов создал проект, прикрутил к нему вебпак и много чего ещё. Написал приложение, которое работает из папки проекта, если запускать скриптом "webpack-dev-server --mode development".
Решил выкатить его на сервер ради теста.
Запустил "webpack --mode production". Получил папку dist с bundle.js, style.css, index.html.
Если закинуть всё это на сервер с Apache и настроить Rewrite, то всё работает. Но при этом клиенту загружается весь бандл, а это уже больше 2 Мб.
Если я правильно понял, для того, чтобы клиенту отдавалась только запрошенная страница, нужно запускать сервер на NodeJS. Как не бился, ничего не получилось. Подскажите, как правильно это сделать?

Comments

[dev null]

Ну 2 мегабайта это в неминифицированом виде наверное?

Answer 1

[Robur]

вы не правильно поняли.
Чтобы отдавалась только загруженная страница, вам надо переделать приложение чтобы оно собиралось не в один большой файл а в пачку маленьких, и нужные файлы автоматически загружались при переходе по страницам - как это сделать, гуглите webpack code splitting, dynamic imports, react router в разных комбинациях.
Начните с "react-router code splitting"

Comments

[ASiD]

Правильно ли я понимаю, если я создам приложение на основе сборки из create-react-app, build, который получится после npm run build можно будет залить на обычный хостинг с apache и нормально пользоваться? Или для подобных приложений используют какие-то другие серверы?

[Robur]

ASiD, да, это просто html+css+js, в этом плане ничего не поменялось за последние 15 лет.

Answer 2

[eternalfire]

ASiD советую поставить стандартное приложение с помощью create-react-app, выполнить npm run eject и посмотреть на конфиг вебпак
Там реализовано так как надо с code splitting, dynamic imports и tree shaking и тд