Lingo.dev + .md/.mdx (Dokumentation)

Lingo.dev CLI übersetzt Markdown und MDX-Dokumentation, Blogs und Inhalte unter Beibehaltung der Formatierung, Codeblöcke, Links, React-Komponenten und interaktiven Elemente. Die CLI verwendet den mdx Bucket als empfohlene Konfiguration für sowohl .md als auch .mdx Dateien, schützt Codeblöcke und Inline-Code vor Übersetzung, bewahrt URLs während Beschreibungen übersetzt werden, erhält Frontmatter-Metadaten, behält React-Komponenten und Importe intakt, übersetzt JSX-Props intelligent und arbeitet nahtlos mit Next.js, Gatsby und MDX-Tooling zusammen.

Schnelleinrichtung

Konfiguration mit dem mdx Bucket für sowohl Markdown- als auch MDX-Dateien:

{
  "locale": {
    "source": "en",
    "targets": ["es", "fr", "de"]
  },
  "buckets": {
    "mdx": {
      "include": ["docs/[locale]/*.md", "content/[locale]/*.mdx"]
    }
  }
}

Hinweis: [locale] ist ein Platzhalter, der wörtlich in der Konfiguration verbleiben sollte, da er während der CLI-Ausführung durch die tatsächliche Locale ersetzt wird.

Dokumentation übersetzen

npx lingo.dev@latest i18n

Übersetzt Inhalte unter Beibehaltung aller Markdown-Formatierungen und MDX React-Komponenten.

Markdown-Inhaltsverarbeitung

Codeblock-Erhaltung

```javascript
const message = "Hello, world!";
console.log(message);
```

Code bleibt unübersetzt, während umgebende Erklärungen lokalisiert werden.

Link- und Referenzbehandlung

Visit [our website](https://example.com) for more details.

See the [configuration guide](./config.md) for setup instructions.

URLs und relative Pfade bleiben intakt, während Linktexte übersetzt werden.

Frontmatter-Schutz

---

title: "Getting Started"
date: 2024-01-15
tags: ["tutorial", "beginner"]

---

# Getting Started

Your content begins here...

YAML-Frontmatter bleibt unverändert, während der Inhalt übersetzt wird.

MDX-Komponentenfunktionen

React-Komponentenblöcke

import { Alert } from "@components/Alert";

# Willkommensanleitung

<Alert type="info">Dies ist eine wichtige Information für Benutzer.</Alert>

Regulären Markdown-Inhalt wird hier übersetzt.

Component-Importe und JSX bleiben intakt, während Textinhalte lokalisiert werden.

Inline JSX-Elemente

Hier ist eine <Button variant="primary">Loslegen</Button> Schaltfläche im Text.

Die Komponente bleibt erhalten, aber "Loslegen" wird übersetzt.

Props mit übersetzbarem Inhalt

<VideoPlayer
  title="Einführungsvideo"
  description="Lernen Sie die Grundlagen in 5 Minuten"
  src="/videos/intro.mp4"
/>

String-Props werden übersetzt, während technische Props unverändert bleiben.

Export-Anweisungen

export const title = "Benutzerhandbuch";
export const published = "2024-01-15";

# {title}

Inhalt beginnt hier...

Benannte Exporte mit übersetzbarem Inhalt werden lokalisiert.

Frontmatter mit Komponenten

---

title: "Erste Schritte"
components:
  - Alert
  - CodeBlock

---

import { Alert, CodeBlock } from "@components";

<Alert>Willkommen auf unserer Plattform!</Alert>

Erweiterte Konfiguration

Mehrere Inhaltsverzeichnisse

"mdx": {
  "include": [
    "docs/[locale]/*.md",
    "content/[locale]/*.mdx",
    "blog/[locale]/*.{md,mdx}"
  ]
}

Hinweis: Doppelte Sternchen (**) werden in Glob-Mustern nicht unterstützt. Verwenden Sie einzelne Sternchen (*) für die Dateizuordnung innerhalb von Verzeichnissen.

Bestimmte Dateien ausschließen

"mdx": {
  "include": ["docs/[locale]/*.{md,mdx}"],
  "exclude": ["docs/[locale]/drafts/*.{md,mdx}"]
}

Komponenten-Props sperren

"mdx": {
  "include": ["content/[locale]/*.{md,mdx}"],
  "lockedKeys": ["src", "href", "id", "className"]
}