Starlight

Traduction IA pour Starlight avec Lingo.dev CLI

Qu'est-ce que Starlight ?

Starlight est un thème de documentation construit sur le framework Astro. Il fournit une navigation de site intégrée, une recherche, l'internationalisation et des fonctionnalités SEO pour créer des sites de documentation beaux et accessibles.

Qu'est-ce que Lingo.dev CLI ?

Lingo.dev est une plateforme de traduction alimentée par l'IA. Le CLI Lingo.dev lit les fichiers sources, envoie le contenu traduisible aux grands modèles de langage et réécrit les fichiers traduits dans votre projet.

À propos de ce guide

Ce guide explique comment configurer Lingo.dev CLI dans un site de documentation Starlight. Vous apprendrez comment créer un projet avec Starlight, configurer un pipeline de traduction et visualiser les résultats.

Étape 1. Configurer un projet Starlight

  1. Créez une nouvelle application Starlight :

    npm create astro@latest -- --template starlight

  2. Naviguez dans le répertoire du projet :

    cd <your-starlight-project>

Étape 2. Créer le contenu source

  1. Créez un répertoire pour stocker la documentation dans la locale source :

    mkdir -p src/content/docs/en

  2. Créez un fichier contenant du contenu de documentation (par exemple, src/content/docs/en/index.mdx) :

    ---
title: "Welcome"
description: "Getting started with our documentation"
---

## Introduction

This documentation is automatically translated by Lingo.dev.

## Features

Our product includes powerful capabilities for modern development.

Étape 3. Configurer le CLI

À la racine du projet, créez un fichier i18n.json :

{
  "$schema": "https://lingo.dev/schema/i18n.json",
  "version": "1.10",
  "locale": {
    "source": "en",
    "targets": ["es"]
  },
  "buckets": {
    "mdx": {
      "include": [
        "src/content/docs/[locale]/*.mdx",
        "src/content/docs/[locale]/*/*.mdx"
      ]
    }
  }
}

Ce fichier définit :

  • les fichiers que Lingo.dev CLI doit traduire
  • les langues entre lesquelles traduire

Dans ce cas, la configuration traduit les fichiers MDX de l'anglais vers l'espagnol.

Il est important de noter que :

  • [locale] est un espace réservé qui est remplacé à l'exécution. Il garantit que le contenu est lu depuis un emplacement (par exemple, src/content/docs/en/index.mdx) et écrit vers un emplacement différent (par exemple, src/content/docs/es/index.mdx).
  • La CLI Lingo.dev ne prend pas en charge les motifs glob récursifs (par exemple, **/*.mdx). Vous devrez créer des motifs include supplémentaires pour traduire les fichiers qui existent dans des répertoires imbriqués.

Pour en savoir plus, consultez Configuration i18n.json.

Étape 4. Traduire le contenu

  1. Créez un compte Lingo.dev.

  2. Connectez-vous à Lingo.dev via la CLI :

    npx lingo.dev@latest login

  3. Exécutez le pipeline de traduction :

    npx lingo.dev@latest run

    La CLI créera un répertoire src/content/docs/es/ pour stocker le contenu traduit et un fichier i18n.lock pour suivre ce qui a été traduit (afin d'éviter les retraductions inutiles).

Étape 5. Utiliser les traductions

  1. Dans le fichier astro.config.mjs, configurez les locales prises en charge :

    import { defineConfig } from "astro/config";
import starlight from "@astrojs/starlight";

export default defineConfig({
  integrations: [
    starlight({
      title: "My Docs",
      defaultLocale: "en",
      locales: {
        en: {
          label: "English",
          lang: "en",
        },
        es: {
          label: "Español",
          lang: "es",
        },
      },
    }),
  ],
});

  2. Démarrez le serveur de développement :

    npm run dev

  3. Accédez aux URL suivantes :