|Labs
Rezervovat demoPlatforma
React (Lingo Compiler)
Alpha
React (MCP)React (i18n)Legacy CLI (v0)
Zastaralé

Lingo.dev Compiler

  • Jak to funguje
  • Nastavení
  • Compiler: rychlý start

Frameworky

  • Integrace s Next.js
  • Vite + React

Průvodci

  • Přepínání jazyků
  • Automatická pluralizace
  • Ruční přepsání
  • Režimy sestavení
  • Struktura projektu
  • Poskytovatelé překladu
  • Vlastní resolvery jazyka
  • Vývojové nástroje

Reference

  • Osvědčené postupy
  • Configuration Reference
  • Řešení problémů
  • Průvodce migrací
  • Optimalizace
  • Výstupní formáty

Vývojové nástroje

Alfa

Lingo.dev Compiler je ve fázi alfa. Je nestabilní, nedoporučuje se pro produkční nasazení a rozhraní API se mohou mezi jednotlivými vydáními měnit.

Lingo.dev Compiler obsahuje vývojové nástroje, díky kterým můžete rychle iterovat nad vícejazyčným UI bez volání externích API. Pomůžou vám ověřit, že je veškerý text přeložitelný, otestovat rozvržení s různou délkou textu a při vývoji ladit problémy s překlady.

Pseudopřekladač#

Pseudopřekladač generuje okamžité falešné překlady tak, že obaluje zdrojový text vizuálními značkami. Nepotřebujete žádný API klíč, neprobíhají žádná síťová volání a výsledky se zobrazí okamžitě.

Aktivujete ho v konfiguraci Compileru:

ts
{
  dev: {
    usePseudotranslator: true,
  },
}

Co vytváří#

Zdrojový textPseudopřeklad
Welcome[!!! Welcome !!!]
Sign in to your account[!!! Sign in to your account !!!]
Items: {count}[!!! Items: {count} !!!]

Značky ([!!! ... !!!]) vizuálně odlišují přeložený text od nepřeloženého. Pokud v UI vidíte syrovou angličtinu, zatímco je pseudopřekladač aktivní, znamená to, že tento text Compiler nezpracovává.

Případy použití#

1

Najděte nepřeložené řetězce

Spusťte aplikaci s aktivním pseudopřekladačem. Jakýkoli text, který se zobrazí bez značek [!!! ... !!!], Compiler nedetekuje. Stává se to například tehdy, když je text uložený v proměnných mimo JSX nebo když je komponenta mimo adresář sourceRoot.

2

Otestujte rozvržení s delším textem

Pseudopřeklady jsou delší než zdrojový text (kvůli znakům značek). Tím simulují jazyky jako němčina nebo francouzština, které obvykle vytvářejí o 20–30 % delší text než angličtina, a pomáhají včas odhalit problémy s přetékáním rozvržení.

3

Ověřte interpolaci

Zástupné symboly jako {count} a {name} by se měly objevit uvnitř značek pseudopřekladu. Pokud se zástupný symbol objeví mimo značky nebo chybí, Compiler ho možná nezachovává správně.

Pseudopřekladač používá stejnou překladovou pipeline jako reální poskytovatelé – prochází stejnou analýzou AST i stejnými kroky injektáže kódu. Jediný rozdíl je v kroku generování překladu, kde značky nahrazují volání LLM.

Překladový server#

Během vývoje Compiler spouští lokální překladový server, který zpracovává překladové požadavky na vyžádání. Server se spustí automaticky, když spustíte npm run dev.

Jak to funguje#

Překladový server naslouchá na lokálním portu a zpracovává překladové požadavky z vývojové build pipeline. Když Compiler detekuje nový nebo změněný řetězec, odešle ho na server, který ho předá nakonfigurovanému poskytovateli překladu (nebo pseudopřekladači).

Konfigurace portu#

Server automaticky najde dostupný port v konfigurovatelném rozsahu:

ts
{
  dev: {
    translationServerStartPort: 60000,
  },
}
MožnostVýchozí hodnotaPopis
translationServerStartPort60000Počáteční číslo portu. Server zkouší porty postupně (60000, 60001, ..., 60099), dokud nenajde volný.
translationServerUrldetekováno automatickyÚplně přepíše URL serveru. Hodí se pro připojení ke vzdálenému překladovému serveru nebo vlastní proxy.

Pokud jsou všechny porty v rozsahu 60000–60099 obsazené, server se nespustí. Jak vyřešit konflikty portů najdete v Troubleshooting.

Vývojářský widget (již brzy)#

Editor překladů v prohlížeči, který vám při procházení aplikace umožní zobrazovat a upravovat překlady v reálném čase. Widget se překryje přes vaše UI a zobrazí podrobnosti o překladu pro každý textový prvek.

Plánované funkce:

  • Klikněte na libovolný textový prvek a zobrazte si jeho zdrojový text, překlady a metadata
  • Upravujte překlady přímo v prohlížeči
  • Změny se okamžitě uloží do .lingo/metadata.json
  • Přepínejte mezi jazyky bez nutnosti znovu načítat stránku

Stav

Vývojářský widget je momentálně ve vývoji a zatím není k dispozici. Novinky o vydáních sledujte v changelogu.

Doporučená konfigurace pro vývoj#

Pro co nejrychlejší vývoj zkombinujte pseudopřekladač s výchozím nastavením překladového serveru:

ts
{
  dev: {
    usePseudotranslator: true,
    translationServerStartPort: 60000,
  },
}

Až budete připraveni zobrazit si náhled skutečných překladů, pseudopřekladač vypněte a restartujte vývojový server:

ts
{
  dev: {
    usePseudotranslator: false,
  },
}

Compiler pak pro nové nebo změněné řetězce vygeneruje skutečné překlady pomocí vašeho nakonfigurovaného translation provider.

Další kroky#

Režimy sestavení
Vývojové, CI a produkční workflows
Configuration Reference
Všechny možnosti pro vývoj
Troubleshooting
Konflikty portů a další problémy při vývoji
Best Practices
Doporučený workflow pro vývoj

Byla tato stránka užitečná?

Max PrilutskiyMax Prilutskiy·Aktualizováno před 4 měsíci·3 min čtení