|Labs
预约演示平台
React(Lingo Compiler)
Alpha
React (MCP)React(i18n)旧版 CLI(v0)
已废弃

Lingo.dev Compiler

  • 工作方式
  • 快速开始
  • Compiler 快速上手

框架

  • Next.js 集成
  • Vite + React

指南

  • 语言切换
  • 自动复数处理
  • 手动覆盖
  • 构建模式
  • 项目结构
  • 翻译服务提供商
  • 自定义 locale 解析器
  • 开发工具

参考

  • 最佳实践
  • 配置参考
  • 故障排查
  • 迁移指南
  • 优化
  • 输出格式

配置参考

Alpha

Lingo.dev Compiler 目前仍处于 Alpha 阶段,稳定性尚未完善,不建议用于生产环境,且 API 可能会在不同版本之间发生变化。

Lingo.dev Compiler 的配置对象决定了你的 React 应用在构建阶段如何完成翻译。此页面汇总了全部可用选项,包括类型、默认值和使用示例。

核心选项#

选项类型默认值说明
sourceRootstring"src"存放可翻译组件的目录,相对于项目根目录。
lingoDirstring".lingo"用于存放翻译元数据和缓存文件的目录。
sourceLocalestring必填源内容的语言代码(例如 "en")。
targetLocalesstring[]必填目标语言代码数组(例如 ["es", "de", "fr"])。
useDirectivebooleanfalse当为 true 时,仅翻译带有 'use i18n' 指令的文件;当为 false 时,则会翻译 sourceRoot 中的所有文件。
modelsstring | object"lingo.dev"翻译提供方配置。字符串可作为所有 locale 对的默认值;对象则可将不同 locale 对映射到指定提供方。
promptstringundefined用于翻译 LLM 的自定义 system prompt,支持 {SOURCE_LOCALE} 和 {TARGET_LOCALE} 占位符。
buildMode"translate" | "cache-only""translate"控制 Compiler 是生成新翻译,还是只使用缓存中的翻译。

开发选项#

dev 键下的选项用于控制开发阶段的行为:

选项类型默认值说明
dev.usePseudotranslatorbooleanfalse生成即时伪翻译(例如 [!!! Welcome !!!]),无需调用 LLM,也不需要 API 密钥。
dev.translationServerStartPortnumber60000本地翻译服务器的起始端口。Compiler 会在 60000-60099 范围内自动寻找可用端口。
dev.translationServerUrlstringundefined覆盖翻译服务器的 URL,适用于自定义部署或远程翻译服务器。

Locale 持久化#

localePersistence 下的选项用于控制如何存储和读取用户所选的 locale:

选项类型默认值说明
localePersistence.typestring"cookie"持久化机制,目前支持 "cookie"。
localePersistence.config.namestring"locale"用于存储 locale 的 Cookie 名称。
localePersistence.config.maxAgenumber31536000Cookie 的 max-age(秒),默认值为 1 年。

如果你需要自定义持久化逻辑(localStorage、基于 URL 或请求头),请参阅 Custom Locale Resolvers。

复数处理#

pluralization 下的选项用于控制复数形式的自动检测与生成:

选项类型默认值说明
pluralization.enabledbooleantrue启用或关闭自动复数检测。
pluralization.modelstring"groq:llama-3.1-8b-instant"用于检测源文本复数形式的 LLM 模型。由于检测比翻译更简单,建议使用更小、更快的模型。

想了解复数检测的工作方式,请参阅 Automatic Pluralization。

环境变量#

环境变量可用于覆盖或补充配置:

变量何时需要说明
LINGO_BUILD_MODE可选覆盖 buildMode 配置项。可设置为 "translate" 或 "cache-only"。
LINGODOTDEV_API_KEY使用 "lingo.dev" 模型时Lingo.dev 本地化引擎的 API 密钥,可通过 npx lingo.dev@latest login 获取。
OPENAI_API_KEY使用 "openai:*" 模型时OpenAI API 密钥。
ANTHROPIC_API_KEY使用 "anthropic:*" 模型时Anthropic API 密钥。
GOOGLE_API_KEY使用 "google:*" 模型时Google AI API 密钥。
GROQ_API_KEY使用 "groq:*" 模型时Groq API 密钥。
MISTRAL_API_KEY使用 "mistral:*" 模型时Mistral API 密钥。
OPENROUTER_API_KEY使用 "openrouter:*" 模型时OpenRouter API 密钥。

完整示例#

ts
// next.config.ts
import type { NextConfig } from "next";
import { withLingo } from "@lingo.dev/compiler/next";

const nextConfig: NextConfig = {};

export default async function (): Promise<NextConfig> {
  return await withLingo(nextConfig, {
    sourceRoot: "./app",
    lingoDir: ".lingo",
    sourceLocale: "en",
    targetLocales: ["es", "de", "fr", "ja"],
    useDirective: false,
    models: {
      "*:*": "lingo.dev",
      "*:ja": "anthropic:claude-3-5-sonnet",
    },
    prompt: "Translate UI text from {SOURCE_LOCALE} to {TARGET_LOCALE}. Keep it concise.",
    buildMode: "translate",
    dev: {
      usePseudotranslator: true,
      translationServerStartPort: 60000,
    },
    localePersistence: {
      type: "cookie",
      config: {
        name: "locale",
        maxAge: 31536000,
      },
    },
    pluralization: {
      enabled: true,
      model: "groq:llama-3.1-8b-instant",
    },
  });
}

下一步#

翻译提供方
查看所有支持的 LLM 提供方及 locale 对映射
构建模式
了解开发、CI 与生产环境的工作流
Custom Locale Resolvers
实现自定义 locale 检测
最佳实践
生产环境推荐方案

这个页面对你有帮助吗?

Max PrilutskiyMax Prilutskiy·已更新 4 个月前·3 分钟阅读