Это прототип архитектуры проекта ProCharity для изучения сборки микро-фронтенда на основе Webpack Module Federation для vite. А также интеграция с бекендом микросервисов на основе Moleculer.
Проект сделан на JS, без типизации чтобы сконцентрироваться именно на настройках сборки и интеграции, так что код не претендует на эталонность и качество. Важнее обратить внимание на то как настроены vite.config.js файлы, докер и core микросервисы.
core- корневой загрузчик микросервисовservices- микросервисы и микрофронтенды бизнес-логикиuikit- библиотека компонентов для микрофронтендовapi- код серверной бизнес логикиnginx- конфигурация nginx для проксирования запросов к микросервисам и формирования единого фронтенда из частей (под одним адресом, ключевое)docker-compose.yml- файл для запуска всех микросервисов и фронтенда в докере
- Установить зависимости
yarn- Собрать интерфейсы
yarn build- Запустить бекенд
yarn dev- Запустить фронтенд
yarn server- Открыть в браузере
Открыть в браузере http://localhost
Адрес инстанса лаборатории смотрите в выводе yarn dev.
- пока не работает шаринг контекста между микрофронтендами, временно контекст читается из локального хранилища, но это не правильно и в прочарити добавим глобальный менеджер состояний для обмена данными
- чтобы обновить интерфейсы их надо пересобрать, а после обновить страницу в браузере, иначе нужно проксировать запросы к дев-серверу, но в этом случае придется код копировать и запускать внутри докера чтобы контролировать порты