lingui/js-lingui

Лингуй js

Lingui — это лёгкая, открытая библиотека интернационализации (i18n) для JavaScript и TypeScript. Она предоставляет макросы во время компиляции и CLI для извлечения сообщений в React, React Native, Vue, SolidJS, Astro, Svelte и Node.js.

Около 2 кБ gzip-ядра · 6M+ npm загрузок в месяц · MIT лицензировано

! [Главный люкс] [Бейдж-Мейнсьют-GithubCI] ! [Тестирование рабочего процесса релиза] [Тестирование рабочего процессаТестирование значка-GithubCI]

[Документация] [Документация] · Быстрый старт · Почему на Лингуи · Поддержка · Вносить вклад · Лицензия

Быстрый старт

Макросы Lingui запускаются во время сборки, поэтому добавьте макро-плагин для вашего транспилятора и создайте lingui.config.js. Руководство по установке охватывает оба варианта за несколько минут.

Затем оберните нужный текст макросом Trans. Нет никаких идентификаторов сообщений для изобретения и отдельного JSON-файла для синхронизации:

Извлечь сообщения в каталоги PO, перевести их, затем скомпилировать каталоги в оптимизированный выход во время выполнения:

После перевода чешский каталог в src/locales/cs/messages.po выглядит так. Тег означает элемент , поэтому переводчики никогда не трогают вашу разметку:

Quick Start

npm install @lingui/core @lingui/react
npm install --save-dev @lingui/cli

Lingui macros run at build time, so add the macro plugin for your transpiler and create a lingui.config.js. The installation guide covers both in a few minutes.

Then wrap the text you want to translate in the Trans macro. There are no message IDs to invent and no separate JSON file to keep in sync:

import { i18n } from "@lingui/core"
import { I18nProvider } from "@lingui/react"
import { Trans } from "@lingui/react/macro"
import { messages } from "./locales/en/messages"

i18n.load("en", messages)
i18n.activate("en")

export function App() {
  return (
    
      
        Read the documentation for more info.
      
    
  )
}

Extract the messages into PO catalogs, translate them, then compile the catalogs into optimized runtime output:

npx lingui extract
npx lingui compile

After translation, the Czech catalog in src/locales/cs/messages.po looks like this. The tag stands for the element, so translators never touch your markup:

#: src/App.jsx:12
msgid "Read the documentation for more info."
msgstr "Přečtěte si dokumentaci pro více informací."

Continue with the React tutorial, or jump to React Server Components, React Native, SolidJS, Vue, or plain JavaScript. Working projects for Vite, Next.js, Remix, TanStack Start, React Native and more live in the examples directory.

Why Lingui

In key-based i18n libraries you invent a key, put the text in a JSON file, and reference the key from the code. With Lingui, the text stays where it is read:

// Key-based i18n: the code holds a key, the text lives somewhere else
{t("dashboard.welcome.title")}