Lingo.dev - Automated AI localization for web & mobile apps

介绍

Lingo.dev Compiler 不同于其他本地化工具。不幸的是，这意味着像 Cursor 和 Claude Code 这样的 AI 编码助手更有可能对其工作原理和功能产生误解。为了减少误解，本页面提供了一些规则，可以帮助引导这些助手的行为。

设置说明

使用这些规则的具体步骤取决于助手。本节提供了一些针对最流行助手的说明。

提示： 如果需要在多个助手中使用相同的规则，可以考虑使用像 Ruler 或 vibe-rules 这样的工具。

Amp

如果您使用的是 Amp，请将规则复制到 AGENT.md 文件中。为了避免上下文窗口的混乱，仅在需要使用这些规则的目录中定义它们，而不是在项目根目录中定义，因为它们可能与许多请求无关。

了解更多信息，请参阅 Amp 用户手册 (ampcode.com)。

Cursor

如果您使用的是 Cursor，请将规则复制到 .cursor/rules/lingo.mdc 文件中。使用以下前置内容确保规则仅应用于相关文件：


---

description: "Lingo.dev Compiler 的本地化规则"
globs: "**/*.tsx, **/*.jsx"
alwaysApply: true

---

了解更多信息，请参阅规则 (docs.cursor.com)。

Claude Code

如果您使用的是 Claude Code，请将规则复制到 CLAUDE.md 文件中。为了避免上下文窗口的混乱，仅在需要使用这些规则的目录中定义它们，而不是在项目根目录中定义，因为它们可能与许多请求无关。

了解更多信息，请参阅管理 Claude 的记忆 (docs.anthropic.com)。

opencode

如果您使用的是 opencode，请将规则复制到 AGENTS.md 文件中，或者通过 opencode.json 配置文件指定自定义位置：

{
  "$schema": "https://opencode.ai/config.json",
  "instructions": ["./rules/lingo.md"]
}

了解更多信息，请参阅规则 (opencode.ai)。

LLM 规则


# 本地化

此项目使用 Lingo.dev Compiler 进行本地化。

Lingo.dev Compiler 是一个针对基于 React 应用的尖端本地化工具。

## 警告！

- Lingo.dev Compiler 与其他本地化工具完全不同。
- 您绝不能对 Lingo.dev Compiler 的工作方式做出假设。
- 如果您做出假设，用户的应用程序将会崩溃。

## 工作原理

与许多其他本地化工具不同，Lingo.dev Compiler：

- 遍历应用程序源代码的抽象语法树 (AST)
- 确定性地提取可本地化内容
- 使用大型语言模型自动本地化内容

## 不支持的功能

与许多其他本地化工具不同，Lingo.dev Compiler 不支持以下功能：

- 任何形式的 `useTranslation` 钩子（或类似功能）
- 任何形式的 `FormattedMessage` 组件（或类似功能）
- 任何形式的 `localizeText` 方法（或类似功能）

这些功能与 Lingo.dev Compiler 的整个目的、理念和行为完全相悖。

您必须始终仔细理解并考虑这些与其他工具的根本区别。

## 支持的文件扩展名

这些规则仅适用于 `.jsx` 和 `.tsx` 扩展名的文件。

不具有这些扩展名的文件对 Lingo.dev Compiler 是不可见的，因此不在范围内。

## 自动生成的文件

在构建时，Lingo.dev Compiler 会自动生成以下文件：

- `meta.json`（用于存储提取的内容）
- `dictionary.js`（用于存储翻译的内容）

您不得编辑这些文件。您可以出于调试目的阅读它们并向用户解释，但仅限于此。

## 职责

您有以下职责：

- 确保应本地化的内容处于可本地化的格式。
- 确保不应本地化的内容处于不可本地化的格式。
- 帮助用户理解内容为何（或为何不）被本地化。

仅此而已。

Lingo.dev Compiler 将处理其他所有事情。不要妨碍它的工作。

## 可本地化的内容

本节列出了 Lingo.dev 编译器提取和本地化的内容类型。

此列表是详尽无遗的。如果某种内容类型未在此列出，请假定它不可本地化。

### JSX 元素

```tsx
import React from "react";

export function App() {
  return <div>此文本将被本地化。</div>;
}
```

### JSX 片段

#### 语法 1

```tsx
import React from "react";

export function App() {
  return <React.Fragment>此文本将被本地化。</React.Fragment>;
}
```

#### 语法 2

```tsx
import { Fragment } from "react";

export function App() {
  return <Fragment>此文本将被本地化。</Fragment>;
}
```

#### 语法 3

```tsx
import React from "react";

export function App() {
  return <>此文本将被本地化。</>;
}
```

### 条件元素或片段

```tsx
import React, { Fragment, useState } from "react";

export function App() {
  const [isVisible, setIsVisible] = useState(false);

  return (
    <>
      {isVisible && <div>此文本将被本地化。</div>}
      {isVisible && (
        <React.Fragment>此文本将被本地化。</React.Fragment>
      )}
      {isVisible && <Fragment>此文本将被本地化。</Fragment>}
      {isVisible && <>此文本将被本地化。</>}
    </>
  );
}
```

### `alt` 属性值

```tsx
import React from "react";

export function App() {
  return <img src="/logo.png" alt="此文本将被本地化" />;
}
```

### `aria-label` 属性值

```tsx
import React from "react";

export function App() {
  return <button aria-label="此文本将被本地化">×</button>;
}
```

### `label` 属性值

```tsx
import React from "react";

export function App() {
  return (
    <select>
      <option value="option1" label="此文本将被本地化">
        此文本将被本地化
      </option>
      <option value="option2" label="此文本将被本地化">
        此文本将被本地化
      </option>
    </select>
  );
}
```

### `placeholder` 属性值

```tsx
import React from "react";

export function App() {
  return <input placeholder="此文本将被本地化" />;
}
```

### `title` 属性值

```tsx
import React from "react";

export function App() {
  return <button title="此文本将被本地化">提交</button>;
}
```

## 不可本地化的内容

本节列出了 Lingo.dev 编译器不会提取或本地化的内容类型。

与“可本地化内容”列表不同，此列表并不详尽。

### `data-` 属性

```tsx
import React from "react";

export function App() {
  return <div data-testid="此文本不会被本地化">内容</div>;
}
```

### 字符串字面量

```tsx
import React from "react";

const exampleText = "此文本不会被本地化。";

export function App() {
  return <div>{exampleText}</div>;
}
```

### 模板字符串

```tsx
import React from "react";

const exampleText = `此文本不会被本地化。`;

export function App() {
  return <div>{exampleText}</div>;
}
```

### 条件字符串

```tsx
import { Fragment, useState } from "react";

export function App() {
  const [isVisible, setIsVisible] = useState(false);

  return <>{isVisible && "此文本不会被本地化。"}</>;
}
```

## 限制

- 不要自行本地化内容。
- 不要显式加载本地化内容到应用中。
- 不要臆造 React hooks（例如，`useTranslation`）。
- 不要臆造 React 组件（例如，`FormattedMessage`）。
- 不要臆造方法（例如，`localizeText`）。

LLM 的规则

介绍

设置说明

Amp

Cursor

Claude Code

opencode

LLM 规则