Le contenu de cette page a été traduit à l'aide d'une IA.

    Voir la dernière version du contenu original en anglais

    Commencer la déclaration de votre contenu

    Extensions de fichiers

    Par défaut, Intlayer surveille tous les fichiers avec les extensions suivantes pour les déclarations de contenu :

    • .content.json
    • .content.ts
    • .content.tsx
    • .content.js
    • .content.jsx
    • .content.mjs
    • .content.mjx
    • .content.cjs
    • .content.cjx

    L'application recherchera par défaut les fichiers correspondant au modèle glob ./src/**/*.content.{json,ts,tsx,js,jsx,mjs,mjx,cjs,cjx}.

    Ces extensions par défaut conviennent à la plupart des applications. Cependant, si vous avez des exigences spécifiques, consultez le guide de personnalisation des extensions de contenu pour des instructions sur la manière de les gérer.

    Pour une liste complète des options de configuration, visitez la documentation de configuration.

    Déclarez Votre Contenu

    Créez et gérez vos dictionnaires :

    src/example.content.tsx
    import { t, enu, cond, nest, md, type Dictionary } from "intlayer";interface Content {  imbricatedContent: {    imbricatedContent2: {      stringContent: string;      numberContent: number;      booleanContent: boolean;      javaScriptContent: string;    };  };  multilingualContent: string;  quantityContent: string;  conditionalContent: string;  externalContent: string;  insertionContent: string;  fileContent: string;  nestedContent: any;  markdownContent: any;  jsxContent: any;}export default {  key: "page",  content: {    imbricatedContent: {      imbricatedContent2: {        stringContent: "Bonjour le monde",        numberContent: 123,        booleanContent: true,        javaScriptContent: `${process.env.NODE_ENV}`,      },    },    multilingualContent: t({      en: "Contenu en anglais",      "en-GB": "Contenu en anglais (UK)",      fr: "Contenu en français",      es: "Contenu en espagnol",    }),    quantityContent: enu({      "<-1": "Moins d'une voiture",      "-1": "Moins une voiture",      "0": "Aucune voiture",      "1": "Une voiture",      ">5": "Quelques voitures",      ">19": "Beaucoup de voitures",    }),    conditionalContent: cond({      true: "La validation est activée",      false: "La validation est désactivée",    }),    nestedContent: nest(      "navbar", // La clé du dictionnaire à imbriquer      "login.button" // [Optionnel] Le chemin vers le contenu à imbriquer    ),    externalContent: fetch("https://example.com").then((res) => res.json())    markdownContent: md("# Exemple de Markdown"),    /*     * Disponible uniquement avec `react-intlayer` ou `next-intlayer`     */    jsxContent: <h1>Mon titre</h1>,  },} satisfies Dictionary<Content>; // [optionnel] Dictionary est générique et vous permet de renforcer le formatage de votre dictionnaire

    Imbrication de fonctions

    Vous pouvez sans problème imbriquer des fonctions dans d'autres.

    Exemple :

    src/example.content.tsx
    import { t, enu, cond, nest, md, type Dictionary } from "intlayer";const getName = async () => "Jean Dupont";export default {  key: "page",  content: {    // `getIntlayer('page','fr').hiMessage` retourne `['Salut', ' ', 'Jean Dupont']`    hiMessage: [      t({        en: "Hi",        fr: "Salut",        es: "Hola",      }),      " ",      getName(),    ],    // Contenu composite imbriquant condition, énumération et contenu multilingue    // `getIntlayer('page','fr').advancedContent(true)(10) retourne 'Plusieurs articles trouvés'`    advancedContent: cond({      true: enu({        "0": t({          en: "No items found",          fr: "Aucun article trouvé",          es: "No se encontraron artículos",        }),        "1": t({          en: "One item found",          fr: "Un article trouvé",          es: "Se encontró un artículo",        }),        ">1": t({          en: "Multiple items found",          fr: "Plusieurs articles trouvés",          es: "Se encontraron múltiples artículos",        }),      }),      false: t({        en: "No valid data available",        fr: "Aucune donnée valide disponible",        es: "No hay datos válidos disponibles",      }),    }),  },} satisfies Dictionary;

    Si vous avez une idée d’amélioration pour améliorer cette documentation, n’hésitez pas à contribuer en submitant une pull request sur GitHub.

    Lien GitHub de la documentation
    Intlayer CMSTraduction