---
title: "Internasionalisasi Plugin"
description: "Internasionalisasi plugin NocoBase: direktori locales, paket bahasa, konfigurasi i18n server dan client."
keywords: "Internasionalisasi,i18n,locales,paket bahasa,multibahasa,NocoBase"
---

# Internasionalisasi

## File Internasionalisasi

Di plugin, file multibahasa frontend dan backend semuanya disimpan di folder `src/locale`.

```bash
|- /plugin-i18n
  |- /src
    |- /locale      # Folder multibahasa
      |- en-US.ts   # Bahasa Inggris
      |- zh-CN.ts   # Bahasa Tionghoa
```

Cukup tambahkan entri terjemahan di file multibahasa yang sesuai (`/src/locale/${lang}.ts`). Jika ini adalah file multibahasa yang ditambahkan untuk pertama kalinya, Anda perlu restart aplikasi agar berlaku. Anda dapat memeriksa interface `app:getLang` untuk memvalidasi apakah entri terjemahan berhasil ditambahkan.

Alamat default: http://localhost:13000/api/app:getLang?locale=zh-CN

## API Terkait 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)

## Server

### app.i18n <Badge>server</Badge>

app.i18n adalah instance i18n global, biasanya digunakan di CLI. Misalnya digabungkan dengan inquirer untuk mengimplementasikan interaksi command line.

```ts
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) <Badge>server</Badge>

### ctx.i18n <Badge>server</Badge>

ctx.i18n adalah cloneInstance dari app.i18n global. Setiap ctx request sepenuhnya independen, merespons informasi multibahasa berdasarkan bahasa client.

Parameter request client dapat ditempatkan di query string

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

Atau ditempatkan di request headers (direkomendasikan)

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

Contoh

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

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

### ctx.t(text, options) <Badge>server</Badge>

### plugin.t() <Badge>server</Badge>

## Client

### ctx.i18n <Badge>client</Badge>

### ctx.t(text, options) <Badge>client</Badge>

### plugin.t()

### useT()

## Function Utility

### tExpr(text) <Badge>server</Badge> <Badge>client</Badge>

## react-i18next

### useTranslation(ns) <Badge>client</Badge>

### withTranslation(ns) <Badge>client</Badge>
