Alpha
O Lingo.dev Compiler está em alpha. Ele é instável, não é recomendado para uso em produção e as APIs podem mudar entre versões.
O atributo data-lingo-override dá a você controle preciso sobre traduções específicas. Quando você precisa de uma tradução exata para um nome de marca, texto jurídico ou headline de marketing, adicione o atributo a qualquer elemento JSX e o Compiler usa as traduções fornecidas por você em vez de gerá-las com IA.
Uso básico#
Passe um objeto que mapeia códigos de idioma para traduções:
<h1 data-lingo-override={{ es: "Bienvenido", de: "Willkommen", fr: "Bienvenue" }}>
Welcome
</h1>O Compiler usa o valor do override para cada idioma especificado. Para idiomas que não estiverem listados no objeto de override, o Compiler gera as traduções normalmente.
Como os overrides funcionam#
O Compiler encontra um elemento JSX com data-lingo-override
Durante a fase de análise da AST, o Compiler detecta o atributo data-lingo-override no elemento.
Os valores de override são extraídos
O mapeamento de idioma para tradução é lido a partir do valor do atributo.
Os overrides têm prioridade
Para cada idioma presente no objeto de override, o Compiler usa a tradução fornecida. A tradução por IA é ignorada para esses idiomas. Idiomas que não estiverem no override são traduzidos normalmente.
Casos de uso#
| Caso de uso | Por que usar override | Exemplo |
|---|---|---|
| Nomes de marca | A IA pode localizar nomes que devem permanecer consistentes entre idiomas | data-lingo-override={{ es: "Lingo.dev", de: "Lingo.dev" }} |
| Copy de marketing | Formulação específica criada por um redator | data-lingo-override={{ es: "Tu motor de localizacion" }} |
| Texto jurídico | Exigências regulatórias pedem uma redação exata | data-lingo-override={{ de: "Datenschutzerklarung" }} |
| Expressões idiomáticas e trocadilhos | Jogos de palavras que exigem criatividade humana | data-lingo-override={{ fr: "C'est la vie" }} |
| UI com limite rígido de caracteres | As traduções por IA podem ultrapassar as restrições de espaço | data-lingo-override={{ ja: "OK" }} |
Exemplos#
Texto de parágrafo#
<p data-lingo-override={{ es: "Crea un motor de localizacion en Lingo.dev" }}>
Create a localization engine on Lingo.dev
</p>Atributos#
Os overrides se aplicam ao conteúdo de texto do elemento. Para atributos traduzíveis como placeholder, alt ou aria-label, o Compiler lida com eles separadamente por meio do pipeline padrão de tradução de atributos.
Overrides parciais#
Você não precisa fornecer overrides para todos os idiomas de destino. Informe apenas os idiomas que precisam de controle manual:
<h2 data-lingo-override={{ ja: "はじめに" }}>
Getting Started
</h2>Neste exemplo, o japonês usa o override, enquanto todos os outros idiomas de destino recebem traduções geradas por IA.
Quando usar overrides vs. outras abordagens#
| Abordagem | Quando usar |
|---|---|
data-lingo-override | Elementos específicos em que você sabe qual é a tradução exata. |
| Glossário (Lingo.dev Engine) | Termos que devem ser traduzidos de forma consistente em todo o app. |
| voz da marca (Lingo.dev Engine) | Preferências de tom e estilo que se aplicam a todas as traduções. |
| Prompts personalizados | Instruções gerais de tradução para todo o conteúdo. |
Os overrides são a opção mais granular — eles se aplicam a um único elemento. Para manter a consistência em todo o projeto, use um glossário ou a voz da marca pela engine de localização da Lingo.dev.
