Сборка любого приложения React создает (если для его компиляции не используется webpack-dev-server) выходные данные, которые состоят из статических файлов: пакетов сценариев и файлов .html, которые ссылаются на пакеты в теге <script>.
Эти файлы можно и нужно скопировать в Express в production build.Тогда у вас есть один сервер на одном хосте.Когда приложение React запускается внутри клиента (например, браузера), оно получает все, включая файлы .html, пакеты сценариев, ответы API из одного источника: экспресс-сервер / сервер.Что, кстати, исключает любую возможность возникновения проблем с CORS, о которых так много людей спрашивают здесь на примере SO.
, например, шаблон проекта , который демонстрирует все это.Если вы выполняете команды:
git clone https://github.com/winwiz1/crisp-react.git
cd crisp-react
yarn install && yarn start:prod
и затем указываете свой браузер на localhost:3000, у вас будет приложение React, работающее внутри вашего браузера, и оно получит все из одного единственного бэкэнда Express.
crisp-реагировать имеет две подкаталоги: client с клиентским приложением React и server с серверной частью Express.Команда build копирует артефакты сборки из одного подкаталога в другой.Таким образом, вы можете даже переименовать или удалить подкаталог client после сборки, это не повлияет на серверную часть Express.