#Internationalisation

#Fichiers d'internationalisation

Dans les plugins, les fichiers multilingues, tant pour le frontend que pour le backend, sont stockés dans le dossier src/locale.

|- /plugin-i18n
  |- /src
    |- /locale      # Dossier multilingue
      |- en-US.ts   # Anglais
      |- zh-CN.ts   # Chinois

Il vous suffit d'ajouter les entrées de traduction dans les fichiers multilingues correspondants (/src/locale/${lang}.ts). Si vous ajoutez un nouveau fichier multilingue pour la première fois, vous devrez redémarrer l'application pour que les modifications prennent effet. Vous pouvez vérifier l'API app:getLang pour vous assurer que les entrées de traduction ont été ajoutées avec succès.

URL par défaut : http://localhost:13000/api/app:getLang?locale=zh-CN

#API liées à l'i18n

• server
  • app.i18n
  • app.t(text, options)
  • ctx.i18n
  • ctx.t(text, options)
  • plugin.t()
• client
  • ctx.i18n
  • ctx.t(text, options)
  • plugin.t()
  • useT()
• utils
  • tExpr(text, options)
• react-i18next
  • useTranslation(ns)
  • withTranslation(ns)

#Serveur

#app.i18n server

app.i18n est l'instance i18n globale, généralement utilisée dans les interfaces en ligne de commande (CLI). Par exemple, elle peut être combinée avec inquirer pour implémenter des interactions en ligne de commande.

import select from '@inquirer/select';
import input from '@inquirer/input';

export class PluginSampleI18nServer extends Plugin {
  load() {
    this.app.command('test-i18n').action(async () => {
      const answer1 = await select({
        message: 'Select a language',
        choices: [
          {
            name: '中文',
            value: 'zh-CN',
          },
          {
            name: 'English',
            value: 'en-US',
          },
        ],
      });
      await this.app.i18n.changeLanguage(answer1);
      const answer2 = await input({
        message: this.app.i18n.t('Enter your name'),
      });
      console.log(this.app.i18n.t(`Your name is {{name}}`, { name: answer2 }));
    });
  }
}

#app.t(text, options) server

#ctx.i18n server

ctx.i18n est une cloneInstance de l'instance app.i18n globale. Le ctx de chaque requête est entièrement indépendant et répond avec les informations multilingues basées sur la langue du client.

Les paramètres de requête du client peuvent être placés dans la chaîne de requête (query string) :

GET /?locale=en-US HTTP/1.1
Host: localhost:13000

Ou dans les en-têtes de requête (recommandé) :

GET / HTTP/1.1
Host: localhost:13000
X-Locale: en-US

Exemple

export class PluginSampleI18nServer extends Plugin {
  load() {
    this.app.use(async (ctx, next) => {
      if (ctx.path === '/api/test-i18n') {
        ctx.body = `${ctx.i18n.t('Hello')} ${ctx.i18n.t('World')}`;
      }
      await next();
    });
  }
}

Consultez http://localhost:13000/api/test-i18n?locale=zh-CN

#ctx.t(text, options) server

#plugin.t() server

#Client

#ctx.i18n client

#ctx.t(text, options) client

#plugin.t()

#useT()

#Fonctions utilitaires

#tExpr(text) server client

#react-i18next

#useTranslation(ns) client

#withTranslation(ns) client