Новий Intlayer v6. Що нового?

Ласкаво просимо в Intlayer v6! У цьому релізі акцент зроблено на продуктивності, developer experience та надійності. Нижче наведено основні моменти, нотатки щодо міграції та приклади, які можна копіювати й вставляти.

Основні зміни

• Нова команда: npx intlayer content test для виявлення відсутніх перекладів
• Нова глобальна опція autoFill для автоматичної генерації відсутніх перекладів
• Команда Fill за замовчуванням пропускає наявні переклади: npx intlayer fill
• Розширення для VS Code: нова панель активності Intlayer (Search і Dictionaries), дія на панелі інструментів/контекстні дії, auto‑reveal, команди Fill/Test
• Збірки у 10× швидші завдяки паралелізації промісів
• Кешування віддалених словників, щоб уникнути повторного запиту при старті програми
• Покращене логування: встановіть log.mode: 'verbose', щоб перевірити поведінку
• Посилена валідація, щоб запобігти падінню додатка через проблеми зі словниками
• Живі оновлення з CMS за допомогою build.importMode = 'live' та pnpm intlayer live
• Виправлення: інтеграція з Vue.js, адаптер Lynx, Visual Editor на Windows

Нове: Перевірка відсутніх перекладів

Швидко проведіть аудит вашого проєкту, щоб знайти відсутні ключі/локалі.

npx intlayer content test

Output:

pnpm intlayer content testВідсутні переклади: - blog-data       - Японська (ja), Корейська (ko), Китайська (zh), Німецька (de), Італійська (it) - src/components/BlogPage/blogData.content.ts - demo-page       - Французька (fr), Італійська (it)                                         - src/components/DemoPage/demo.content.ts - locale-switcher - Італійська (it), Португальська (pt)                                       - src/components/LocaleSwitcher/localeSwitcher.content.tsЛокалі: Англійська (en), Російська (ru), Японська (ja), Французька (fr), Корейська (ko), Китайська (zh), Іспанська (es), Німецька (de), Арабська (ar), Італійська (it), Британська англійська (en-GB), Португальська (pt), Хінді (hi)Обов'язкові локалі: Англійська (en)Відсутні локалі: японська (ja), корейська (ko), китайська (zh), німецька (de), італійська (it), французька (fr), португальська (pt)Відсутні обов'язкові локалі: -Загалом відсутніх локалей: 7Загалом відсутніх обов'язкових локалей: 0

Див. більше опцій у довіднику CLI: Довідник CLI → «Перевірка відсутніх перекладів». А також у розділі Тестування.

Нове: Глобальний autoFill для заповнення відсутніх перекладів

Тепер ви можете ввімкнути auto‑fill глобально, щоб будь-який словник з відсутніми перекладами автоматично заповнювався.

import { type IntlayerConfig, Locales } from "intlayer";const config: IntlayerConfig = {  internationalization: {    locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],    defaultLocale: Locales.ENGLISH,    requiredLocales: [Locales.ENGLISH, Locales.FRENCH],  },  content: {    // Автоматично згенерувати відсутні переклади для всіх словників    autoFill: "./{{fileName}}Filled.content.ts",    //    // autoFill: "/messages/{{locale}}/{{key}}/{{fileName}}.content.json",    //    // autoFill: true, // автоматично згенерувати відсутні переклади для всіх словників, як при використанні "./{{fileName}}.content.json"    //    // autoFill: {    //   en: "./{{fileName}}.en.content.json",    //   fr: "./{{fileName}}.fr.content.json",    //   es: "./{{fileName}}.es.content.json",    // },  },};export default config;

Автоматично заповніть відсутні переклади за допомогою команди npx intlayer fill.

Ви все ще можете тонко налаштувати окремий словник, використовуючи поле autoFill у файлах контенту. Intlayer спочатку врахує конфігурацію для конкретного словника, а потім перейде до глобальної конфігурації. Повну довідку див. в Автозаповнення та Довідник файлу контенту.

Команда fill: безпечніші значення за замовчуванням

Команда fill тепер за замовчуванням заповнює лише відсутні переклади й пропускає вже існуючий контент.

npx intlayer fill

Затронуті ключі словників для обробки: access-key-creation-form-schema, doc-search-metadata, doc-search-page  - [access-key-creation-form-schema]      У словника немає шляху до файлу. Пропускається.  - [access-key-creation-form-schema]      Обробка декларації контенту: src/components/Dashboard/ProjectForm/AccessKey/useAccessKeyCreationFormSchema.content.ts  - [access-key-creation-form-schema]      Немає локалей для заповнення - Пропуск словника  - [doc-search-metadata]                  Словник не має шляху до файлу. Пропуск.  - [doc-search-metadata]                  Обробка декларації контенту: src/app/[locale]/(docs)/doc/search/metadata.content.ts  - [doc-search-metadata]                  Немає локалей для заповнення - Пропуск словника  - [doc-search-page]                      Словник не має шляху до файлу. Пропуск.  - [doc-search-page]                      Обробка декларації контенту: src/app/[locale]/(docs)/doc/search/page.content.ts  - [doc-search-page]                     [Російська (ru)]                   Підготовка перекладу словника з Англійської (en) на Російську (ru)[intlayer]  Застосовано форматування Prettier до src/app/[locale]/(docs)/doc/search/page.content.ts  - [doc-search-page]                      Оголошення вмісту записано до src/app/[locale]/(docs)/doc/search/page.content.ts

Приклади CI доступні в CI/CD.

Оновлене розширення VS Code

Тепер розширення містить виділену вкладку Intlayer в Activity Bar та кілька покращень робочого процесу:

• Панель Intlayer в Activity Bar з двома поданнями:
  • Webview для live-пошуку словників/контенту
  • Дерево словників, яке відображає середовища, словники та пов'язані файли
• Панель інструментів у поданні Dictionaries: Build, Pull, Push, Fill, Refresh, Test, Create Dictionary File
• Контекстні меню: Pull/Push для словників; Fill для файлів
• Auto‑reveal: поточний файл у редакторі підсвічується в дереві словників, коли це застосовно
• Нові команди, доступні в Палітрі команд: Fill Dictionaries і Test Dictionaries

Деталі див. у документації Official VS Code Extension.

Оновлено сервер MCP для підтримки нових можливостей.

• Автозаповнення
• Тестування відсутніх перекладів
• Живі оновлення
• Логування
• Валідація
• Нотатки щодо міграції
• Документація

Сервер MCP допомагає в автоматизації проєктів, що використовують Intlayer. Тестує відсутні переклади для автогенерованого коду. Допомагає зрозуміти вашу конфігурацію та вбудувати документацію Intlayer у вашу IDE.

Продуктивність: у 10× разів швидше

• Паралельна обробка локальних і віддалених словників
• Віддалені словники кешуються, щоб уникнути повторного завантаження при запуску додатку

npx intlayer build

Вивід:

[intlayer]  Preparing Intlayer (v6.0.1)[intlayer]  Dictionaries:[intlayer]  ✓ Local content: 163/163[intlayer]  ✓ Remote content: 100/100[intlayer]   - access-key-creation-form             [local: ✔ built] [distant: ✔ imported][intlayer]   - access-key-form                      [local: ✔ built] [distant: ✔ imported][intlayer]   - ai-ab-testing-section                                 [віддалено: ✔ імпортовано][intlayer]   - application-not-running-view         [локально: ✔ побудовано] [віддалено: ✔ імпортовано][intlayer]   - available-techno-section             [локально: ✔ побудовано] [віддалено: ✔ імпортовано][intlayer]   - blog-data                            [локально: ✔ побудовано][intlayer]   - blog-metadata                        [локольно: ✔ побудовано][intlayer]   - blog-nav-list                        [локально: ✔ побудовано] [віддалено: ✔ імпортовано][intlayer]   - blog-page                                             [віддалено: ✔ отримано][intlayer]   - blog-search-page                     [локально: ✔ побудовано] [віддалено: ✔ імпортовано]...[intlayer]  Вміст завантажено  (Всього: 8401ms - Локально: 4050ms - Віддалено: 4222ms)

Покращення логування

Система логування була покращена, щоб надавати детальнішу інформацію про те, що відбувається під час перетворень під час збірки та виконання.

Увімкніть детальний режим логування, щоб краще зрозуміти, що відбувається під час перетворень під час збірки та виконання.

export default {  log: {    mode: "verbose", // опції: "default" | "verbose" | "disabled"  },};

Див. Конфігурація щодо всіх опцій логування.

Посилена валідація

Обробка словників тепер виконує більш надійну валідацію. Якщо обробка словника не вдається, Intlayer уникає ламання вашого застосунку і відображає корисні повідомлення про помилки.

Живі оновлення з CMS (production‑safe)

Подавайте оновлення контенту в реальному часі (наприклад, редакційні оновлення) у production без перезбирання вашого застосунку.

1. Увімкніть режим live імпорту:

import { type IntlayerConfig } from "intlayer";const config: IntlayerConfig = {  build: {    importMode: "live", // опції: "static" | "dynamic" | "live"  },  editor: {    liveSync: true, // увімкнути live sync на стороні сервера  },};export default config;

2. Запустіть застосунок і live‑процес паралельно:

npx intlayer live --with 'vite preview'

Примітки:

• Тільки словники, позначені для використання live‑режиму, будуть підвантажуватись у реальному часі. Інші оптимізовані для продуктивності.
• Виконується відкат до динамічного імпорту, якщо live API недоступний.

Дивіться CMS and Live Sync та Configuration для повного керівництва.

Паралельний процес для відстеження файлів у Turbopack

Коли ви використовуєте Turbopack у Next.js 14 і новіших версіях як сервер розробки з командою next dev --turbopack, зміни в словниках за замовчуванням не будуть автоматично виявлятися.

Це обмеження виникає через те, що Turbopack не може запускати webpack‑плагіни паралельно для моніторингу змін у ваших файлах контенту.

Щоб обійти це, ми відмовилися від команди intlayer watch, натомість використовуйте опцію --with, щоб одночасно запускати сервер розробки та спостерігача збірки Intlayer.

{  "scripts": {    "dev": "npx intlayer watch --with 'next dev --turbopack'",  },}

Нотатки щодо міграції

• Видалено: dictionaryOutput (раніше i18next або next-intl). Це повернеться як підключні адаптери в майбутніх версіях. Видаліть це поле з вашої конфігурації.
• Пов’язане видалення: i18nextResourcesDir (див. changelog doc/configuration).
• Віддавайте перевагу новій глобальній опції content.autoFill для масштабного генерування відсутніх перекладів.
• Використовуйте npx intlayer content test, щоб контролювати PR на предмет відсутніх перекладів.
• Для докладної діагностики встановіть log.mode = 'verbose'.
• У конфігурації Vite використовуйте intlayer замість intlayerPlugin та intlayerProxy замість intlayerProxyPlugin.

Виправлення

• Покращена стабільність інтеграції з Vue.js
• Покращення адаптера Lynx
• Покращена робота Візуального редактора на Windows

Нотатки щодо міграції з v6 до v7

Перегляньте нотатки щодо міграції з v6 до v7 для отримання додаткової інформації.

Корисні посилання

• Довідник CLI
• Автозаповнення
• Налаштування
• Довідник файлу контенту
• Офіційне розширення для VS Code
• CMS та Live Sync