@lingo.dev/react

@lingo.dev/react é uma biblioteca leve de runtime para traduzir apps React. Ela carrega traduções de arquivos JSONC de idioma, localiza cada uma por um hash de conteúdo estável e renderiza strings (ou árvores React ricas) com suporte a plural/select em ICU e formatação de números, datas, listas e tamanhos de arquivo sensível ao idioma.

A biblioteca não tem etapa própria de build — você escreve l.text("Hello"), a CLI extrai isso durante lingo extract, e a string traduzida é buscada em runtime pelo mesmo hash. Se uma tradução estiver faltando, o texto-fonte é renderizado como fallback.

Instalação#

npm install @lingo.dev/react

Visão rápida#

import { LingoProvider, useLingo } from "@lingo.dev/react";
import esMessages from "./locales/es.json";

export function App() {
  return (
    <LingoProvider locale="es" messages={esMessages}>
      <Greeting name="Ada" />
    </LingoProvider>
  );
}

function Greeting({ name }: { name: string }) {
  const l = useLingo();
  return <p>{l.text("Hello, {name}!", { values: { name }, context: "Hero greeting" })}</p>;
}

Esse é todo o necessário para o caso mais comum: envolva o app uma vez, chame useLingo() de qualquer componente, e o hook devolve o objeto Lingo com .text(), .rich(), plurais, formatadores e metadados sobre o idioma atual.

O que você encontra nesta seção#