Обзор

Функция msg помечает и кодирует строки для перевода.

const encodedString = msg('Привет, мир!');

Закодированную строку следует передать в хук useMessages или функцию getMessages, чтобы получить переводы.

Декодирование

Чтобы получить исходную строку, нужно декодировать её с помощью decodeMsg

import { msg, decodeMsg } from 'gt-next';
const encodedString = msg('Привет, мир!');
const decodedString = decodeMsg(encodedString);
console.log(decodedString); // «Привет, мир!»

Справка

Параметры

Возвращает

Закодированную строку, где интерполированные переменные (если есть) заменены их значениями.

Поведение

Продакшен

Во время процесса CD любой контент внутри функции msg будет переведён до развертывания вашего приложения. Это обеспечивает быструю загрузку для всех локалей, но позволяет переводить только тот контент, который известен на этапе сборки.

После генерации переводы либо (1) сохраняются в CDN, либо (2) включаются в итоговый билд вашего приложения — в зависимости от вашей конфигурации. Затем переведённый контент отдаётся вашим пользователям. Если перевод не найден, будет показан исходный контент.

Обязательно следуйте руководству по деплою здесь.

Разработка

В режиме разработки функция msg будет переводить контент по требованию. Это полезно для прототипирования того, как ваше приложение будет выглядеть на разных языках. Не забудьте добавить Dev API key в переменные окружения, чтобы включить это поведение.

При переводе по требованию в режиме разработки может наблюдаться задержка. В продакшен‑сборках этого не будет, если только контент явно не переводится по требованию, то есть с использованием tx или <Tx>.

Пример

Базовое использование

Вы можете использовать msg для пометки строк для перевода.

import { msg, useMessages } from 'gt-next';

const encodedString = msg('Привет, мир!');

export default function TranslateGreeting() {
  const m = useMessages();
  return (
    <p>
      {m(encodedString)}
    </p>
  );
}

Примечание: «Hello, world!» будет переведено на язык, выбранный пользователем.

Использование переменных

В переводы из словаря можно подставлять переменные.

import { msg, useMessages } from 'gt-next';

const encodedString = msg('Привет, {name}!', { name: 'Алиса' });

export default function TranslateGreeting() {
  const m = useMessages();

  return (
    <p>
      {m(encodedString)}
    </p>
  );
}

Примечание: "Alice" не будет переведено на предпочитаемый пользователем язык, поскольку это переменная.

Использование формата сообщений ICU

gt-next поддерживает формат сообщений ICU, который также позволяет форматировать переменные.

import { msg, useMessages } from 'gt-next';

const encodedString = msg('В корзине {count, plural, =0 {нет товаров} =1 {один товар} other {{count} товаров}}', { count: 10 });

export default function TranslateGreeting() {
  const m = useMessages();
  return (
    <p>
      {m(encodedString)}
    </p>
  );
}

Примечания

• Функция msg помечает строки для перевода.
• Перевод строк с msg выполняется на этапе сборки, до времени выполнения (кроме режима разработки).

Дальнейшие шаги

• См. useMessages для перевода строк.
• См. getMessages для перевода строк в асинхронных серверных компонентах.