@rift/engine — общая часть сайтов вроде riftden.com: интерфейс в стиле игрового HUD, шапка, подвал и поиск, статьи на MDX, тир-лист, угадайка, языки сайта. Ничего не знает о конкретной игре — названия, данные, иконки и тексты передаёт сайт игры.
Используется как git-подмодуль в репозитории сайта, например Gildra-Foundation/LoL:
git submodule add https://github.com/Gildra-Foundation/core.git packages/engineСайт игры подключает его как пакет рабочего пространства npm ("@rift/engine": "*") и собирает исходниками: в next.config.ts — transpilePackages: ['@rift/engine'].
| Папка | Что там |
|---|---|
ui/ |
Кнопки, рамки, полоски ресурса, клавиши, уровень, выбор героя, иконки |
layout/ |
Шапка с меню и переключателем языка, подвал, поиск по Ctrl+K |
i18n/ |
Языки сайта, LocaleProvider, ссылка с префиксом языка, defineMessages |
articles/, mdx/ |
Статьи из MDX-файлов: хранилище, карточки, оглавление |
tierlist/, guess/ |
Конструктор тир-листа и игра «Угадай героя» |
lib/format.ts |
Числа, склонения и даты по языку страницы |
styles/base.css |
Базовые стили и токены темы |
- Внутри движка — только относительные импорты: алиас
@/указывает на сайт игры. - Строки компонентов — в
defineMessages({ ru, en })рядом с компонентом; язык клиентские компоненты берут изLocaleProvider. - Новые параметры компонентов — необязательные: движком пользуются несколько сайтов.
- Перед изменениями в движке проверяйте все сайты, которые его используют:
npm run checkв репозитории сайта.
Как сделать сайт по новой игре — в docs/new-game.md репозитория LoL.