Демо
Папка demo/ содержит готовое к запуску приложение Vue 3, демонстрирующее ключевые возможности vue-i18n-kit: ленивую загрузку локалей, множественное число ICU, локале-зависимое форматирование и редактор перевода в контексте.
Что включает демо:
- Три локали — английская (полная), русская (полная, с формами
one/few/many/other), немецкая (намеренно неполная — не хватает 8 ключей для демонстрации редактора) - EN загружается синхронно, RU/DE — лениво по требованию; Vite разбивает их на отдельные чанки
useT/tm()со слайдерами множественного числа ICU — двигайте слайдер, чтобы наблюдать изменение форм в реальном времени- Форматирование
useFormat— числа, валюта и даты, отрендеренные черезIntlи активную локаль - Переключатель локали
useLocaleс индикатором загрузки, пока идёт получение нового чанка локали - Dev-оверлей — наведите курсор на любой переведённый текст, чтобы увидеть значок карандаша; клик по нему открывает встроенный редактор ключа. Работает только с
npm run demo:full(значки карандаша не внедряются в обычномnpm run demo) - Кнопка Editor UI — при запуске
demo:fullв правом верхнем углу NavBar появляется фиолетовая кнопка «Editor UI ↗»; клик по ней открывает полный редактор словаря по адресуhttp://localhost:4173
Запуск из корня репозитория:
bash
# Собрать пакет, установить зависимости демо, запустить dev-сервер Vite
npm run demo # приложение → http://localhost:5173
# То же самое + запускает полный UI редактора словаря
npm run demo:full # приложение → http://localhost:5173 | редактор → http://localhost:4173npm run demo:full использует vue-i18n-kit dev внутри, который запускает сервер приложения Vite и сервер UI редактора параллельно и автоматически связывает их между собой.
Примечание: оба скрипта сначала пересобирают пакет, чтобы бандл dev-оверлея всегда был актуальным.