Автор:
    Создание:2026-01-21Последнее обновление:2026-01-21

    Пакет react-intlayer

    Пакет react-intlayer предоставляет необходимые инструменты для интеграции Intlayer в React-приложения. Он включает провайдеры контекста, хуки и компоненты для работы с мультиязычным содержимым.

    Установка

    bash
    npm install react-intlayer
    

    Экспорты

    Провайдеры

    Импорт:

    tsx
    import "react-intlayer";
    
    КомпонентОписаниеСвязанная документация
    IntlayerProviderОсновной провайдер, который оборачивает ваше приложение и предоставляет контекст Intlayer. По умолчанию включает поддержку редактора.IntlayerProvider
    IntlayerProviderContentКомпонент-провайдер, ориентированный на контент без функций редактора. Используйте его, когда визуальный редактор не нужен.-
    HTMLProviderПровайдер для настроек интернационализации, связанных с HTML. Позволяет переопределять компоненты для HTML-тегов.-

    Хуки

    Импорт:

    tsx
    import "react-intlayer";
    
    HookОписаниеСвязанная документация
    useIntlayerКлиентский хук, который выбирает один словарь по его ключу и возвращает его содержимое. Использует локаль из контекста, если она не указана.useIntlayer
    useDictionaryHook, который преобразует объект словаря и возвращает содержимое для текущего locale. Обрабатывает t() переводы, перечисления и т.д.useDictionary
    useDictionaryAsyncHook, который обрабатывает асинхронные словари. Принимает мапу словарей, где значения. Promise, и получает результирующий словарь для текущего locale.-
    useDictionaryDynamicХук, который обрабатывает динамические словари, загружаемые по ключу. Внутри использует React Suspense для состояний загрузки.-
    useLocaleКлиентский хук для получения текущей локали, локали по умолчанию, доступных локалей и функции для смены локали.useLocale
    useLocaleBaseХук для получения текущей локали и всех связанных полей (locale, defaultLocale, availableLocales, setLocale) из контекста.-
    usePathnameХук, возвращающий текущий путь (pathname) с удаленным сегментом локали. Реактивно реагирует на навигацию браузера через popstate.usePathname
    useRewriteURLКлиентский хук для управления перезаписью URL. Если для текущего pathname и локали существует правило перезаписи, он обновит URL.useRewriteURL
    useI18nХук, который предоставляет функцию перевода t() для доступа к вложенному содержимому по ключу. Имитирует паттерн i18next/next-intl.useI18n
    useIntlХук, который предоставляет объект Intl, привязанный к локали. Автоматически внедряет текущую локаль и использует оптимизированный кэш.-
    useLocaleStorageХук, который обеспечивает сохранение локали в localStorage или cookies. Возвращает функции получения и установки.-
    useLocaleCookieУстарел. Используйте useLocaleStorage. Хук, который управляет сохранением локали в cookies.-
    useLoadDynamicHook для загрузки динамических словарей с использованием React Suspense. Принимает ключ и promise, кэширует результаты.-
    useIntlayerContextHook, который предоставляет текущие значения контекста клиента Intlayer (locale, setLocale и т.д.).-
    useHTMLContextХук для доступа к переопределениям HTML-компонентов из контекста HTMLProvider.-

    Функции

    Импорт:

    tsx
    import "react-intlayer";
    
    ФункцияОписаниеСвязанный документ
    tФункция перевода на стороне клиента, которая возвращает перевод переданного мультиязычного содержимого. Использует локаль из контекста, если она не указана.перевод
    getDictionaryОбрабатывает объекты словаря и возвращает содержимое для указанной локали. Обрабатывает переводы t(), перечисления, Markdown, HTML и т.д.-
    getIntlayerИзвлекает словарь по его ключу из сгенерированной декларации и возвращает его содержимое для указанной локали. Оптимизированная версия getDictionary.-
    setLocaleInStorageУстанавливает локаль в хранилище (local storage или cookie в зависимости от конфигурации).-
    setLocaleCookieУстарело. Используйте setLocaleInStorage вместо этого. Устанавливает локаль в cookie.-
    localeInStorageПолучает локаль из хранилища (local storage или cookie).-
    localeCookieУстарело. Используйте localeInStorage. Получает локаль из cookie.-

    Компоненты

    Импорт:

    tsx
    import "react-intlayer";
    

    or

    tsx
    import "react-intlayer/markdown";
    
    КомпонентОписаниеСвязанный документ
    MarkdownProviderПровайдер контекста рендеринга markdown. Позволяет задавать кастомные компоненты для элементов markdown.-
    MarkdownRendererРендерит контент в markdown с использованием кастомных компонентов. Поддерживает все стандартные возможности markdown и синтаксис, специфичный для Intlayer.MarkdownRenderer

    Типы

    Импорт:

    tsx
    import "react-intlayer";
    
    ТипОписание
    IntlayerNodeТип, представляющий узел в дереве контента Intlayer. Используется для type-safe манипуляций с контентом.

    Серверная сторона (react-intlayer/server)

    Импорт:

    tsx
    import "react-intlayer/server";
    
    ExportTypeDescription
    IntlayerServerProviderComponentПровайдер для серверного рендеринга.
    IntlayerServerComponentОбёртка Intlayer-контента для серверной стороны.
    tFunctionСерверная версия функции перевода.
    useLocaleHookХук для доступа к локали на стороне сервера.
    useIntlayerHookСерверная версия useIntlayer.
    useDictionaryHookСерверная версия useDictionary.
    useI18nHookСерверная версия useI18n.
    localeFunctionФункция для получения или установки локали на сервере.