Typer les clés de traduction
Déduire une union de clés valides à partir de fichiers de messages.
Typer les clés de traduction est une leçon TypeScript Academy gratuite sur CoddyKit. Ceci est la leçon 1 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage TypeScript Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours TypeScript Academy comprend 4 leçons au total.
Déduction de clés de traduction valides
Dans une configuration d’internationalisation sûre du point de vue des types, l’ensemble des clés de traduction valides est déduit de votre objet de messages. Une faute de frappe comme t("greetng") devient une erreur de compilation, et non un problème de chaîne manquante à l’exécution.
Un objet de messages
Commencez par un objet simple de messages. Il constitue l’unique source de vérité pour les valeurs comme pour le type des clés.
const messages = {
greeting: "Hello",
farewell: "Goodbye",
cart: {
empty: "Your cart is empty",
checkout: "Proceed to checkout",
},
} as const;Clés de premier niveau avec keyof
Pour un objet plat, keyof typeof fournit l’union des clés.
type TopKeys = keyof typeof messages;
// "greeting" | "farewell" | "cart"Le problème des objets imbriqués
Les catalogues de messages réels sont imbriqués. Nous voulons des chemins avec points comme "cart.empty", et pas seulement les clés de premier niveau. Nous avons besoin d’un type récursif qui parcourt l’objet.
Un type de chemin récursif
Un type conditionnel associé à un type mappé construit des chemins avec points en descendant récursivement dans les objets imbriqués et en préfixant les clés. Le préfixe utilise un type littéral de modèle, écrit avec des accents graves dans le code réel sous la forme [backtick]${K}.${Paths<T[K]>}[backtick]. Nous le représentons ci-dessous par JoinPath(K, child) afin de garder la liste claire.
type JoinPath<K extends string, Rest extends string> = K + "." + Rest;
// (Real TS uses a template literal type:
// the K dot Rest pattern delimited by backticks.)
type Paths<T> = {
[K in keyof T & string]: T[K] extends string
? K
: K | (T[K] extends object
? JoinPath<K, Paths<T[K]>>
: never);
}[keyof T & string];Application du type
Fournir le type des messages à Paths produit chaque clé valide avec points.
type MsgKey = Paths<typeof messages>;
// "greeting" | "farewell" | "cart" | "cart.empty" | "cart.checkout"Clés des feuilles uniquement
Souvent, vous ne voulez que les chemins des feuilles (les chaînes réelles), en excluant les objets intermédiaires. Adaptez la récursion afin d’ignorer les nœuds qui ne sont pas des chaînes. Le préfixe K-point-enfant utilise lui aussi un type littéral de modèle (délimité par des accents graves dans le code réel), représenté ici par JoinPath.
type LeafPaths<T> = T extends string
? ""
: {
[K in keyof T & string]: T[K] extends string
? K
: JoinPath<K, LeafPaths<T[K]>>;
}[keyof T & string];
// "greeting" | "farewell" | "cart.empty" | "cart.checkout"Une fonction t typée
Limitez le paramètre de la fonction de traduction à l’union de clés dérivée afin que seules les clés valides soient acceptées à la compilation.
declare function t(key: LeafPaths<typeof messages>): string;
t("cart.empty"); // ok
t("cart.missing"); // Error: not a valid keyRésolution du type de valeur
Vous pouvez aller plus loin et déduire le type de valeur correspondant à un chemin, ce qui est utile lorsque les messages contiennent des entrées qui ne sont pas des chaînes. Un type conditionnel d’indexation de chemin parcourt les points. Il sépare le chemin à l’aide d’un motif de type littéral de modèle qui, dans le code réel, s’écrit avec des accents graves sous la forme Tête.point.Reste avec infer. Nous représentons cette séparation ci-dessous par SplitHead/SplitRest.
// Conceptually: split "cart.empty" into Head="cart", Rest="empty"
// using a template literal pattern with infer.
type ValueAt<T, P extends string> =
P extends SplitHead<infer Head, infer Rest>
? Head extends keyof T ? ValueAt<T[Head], Rest> : never
: P extends keyof T ? T[P] : never;Pourquoi as const est important
Sans as const, les valeurs de chaîne s’élargissent en string et vous perdez les informations littérales nécessaires par la suite, par exemple pour l’extraction des espaces réservés. Déclarez toujours les catalogues comme constants.
Pourquoi c’est important
Déduire les clés du catalogue signifie que l’ajout, le renommage ou la suppression d’un message met instantanément à jour le type de clé autorisé partout. Aucun énumérateur central à maintenir, aucune constante de chaîne obsolète.
Vérification rapide
Confirmez votre compréhension du typage des clés de traduction.
Récapitulatif
Vous avez déduit une union de clés valides à partir d’un objet messages en utilisant keyof et un type de chemin récursif fondé sur un littéral de modèle. Les variantes limitées aux feuilles excluent les objets intermédiaires, un t typé rejette les clés invalides et as const préserve les informations littérales nécessaires au système de types.
Questions Fréquemment Posées
La leçon « Typer les clés de traduction » est-elle gratuite ?
Oui — le texte complet de « Typer les clés de traduction » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours TypeScript Academy, passe à CoddyKit PRO. Le cours TypeScript Academy comprend 4 leçons au total.
Qu'est-ce que j'apprendrai dans « Typer les clés de traduction » ?
Déduire une union de clés valides à partir de fichiers de messages. Tu pratiques TypeScript Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.
Dois-je avoir de l'expérience pour commencer TypeScript Academy ?
Aucune expérience préalable n'est requise. TypeScript Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 1 sur 4.
Combien de temps prend la leçon « Typer les clés de traduction » ?
La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.
Peux-tu écrire et exécuter du code dans cette leçon TypeScript Academy ?
Oui. Chaque leçon TypeScript Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.
Toutes les leçons de ce cours
- Typer les clés de traduction
- Sécurité du typage de l’interpolation
- Pluralisation avec les types
- Inférence des types selon la langue