#Internacionalização

#Arquivos de Internacionalização

Nos plugins, os arquivos multilíngues tanto para o frontend quanto para o backend são armazenados na pasta src/locale.

|- /plugin-i18n
  |- /src
    |- /locale      # Pasta de múltiplos idiomas
      |- en-US.ts   # Idioma inglês
      |- zh-CN.ts   # Idioma chinês

Basta adicionar as entradas de tradução nos arquivos multilíngues correspondentes (/src/locale/${lang}.ts). Se for a primeira vez que você adiciona um arquivo multilíngue, é necessário reiniciar a aplicação para que as alterações entrem em vigor. Você pode verificar a API app:getLang para confirmar se as entradas de tradução foram adicionadas com sucesso.

URL padrão: http://localhost:13000/api/app:getLang?locale=zh-CN

#APIs Relacionadas ao i18n

• servidor
  • app.i18n
  • app.t(text, options)
  • ctx.i18n
  • ctx.t(text, options)
  • plugin.t()
• cliente
  • ctx.i18n
  • ctx.t(text, options)
  • plugin.t()
  • useT()
• utilitários
  • tExpr(text, options)
• react-i18next
  • useTranslation(ns)
  • withTranslation(ns)

#Servidor

#app.i18n servidor

app.i18n é a instância global de i18n, geralmente usada em CLIs. Por exemplo, em combinação com o Inquirer para implementar interações de linha de comando.

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.changeLanguage(answer1);
      const answer2 = await input({
        message: app.i18n.t('Enter your name'),
      });
      console.log(app.i18n.t(`Your name is {{name}}`, { name: answer2 }));
    });
  }
}

#app.t(text, options) servidor

#ctx.i18n servidor

ctx.i18n é uma cloneInstance da instância global app.i18n. O ctx de cada requisição é completamente independente e responde com informações multilíngues com base no idioma do cliente.

Os parâmetros de requisição do cliente podem ser incluídos na query string:

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

Ou nos cabeçalhos da requisição (recomendado):

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

Exemplo

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();
    });
  }
}

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

#ctx.t(text, options) servidor

#plugin.t() servidor

#Cliente

#ctx.i18n cliente

#ctx.t(text, options) cliente

#plugin.t()

#useT()

#Funções Utilitárias

#tExpr(text) servidor cliente

#react-i18next

#useTranslation(ns) cliente

#withTranslation(ns) cliente