# 多言語対応（i18n）

Eagleプラグインにはi18nextモジュールが内蔵されており、開発者が簡単に多言語対応プラグインを作成できます。i18nextはJavaScriptの多言語対応ライブラリで、翻訳やローカリゼーションが容易であり、カスタム翻訳、ローカリゼーション、多言語サポートの機能も提供しています。

以下では、プラグインを多言語対応させる方法を手順ごとに説明します：

## 手順1：`_locales`フォルダを作成する

<figure><img src="https://1611209449-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMvbOurypjZWfptd5H280%2Fuploads%2Fgit-blob-569807c86a1c45f8575718fb2d6ba12d5de015c9%2Fimage%20(20).png?alt=media" alt=""><figcaption></figcaption></figure>

## 手順2：言語 `.json` ファイルを作成する

<figure><img src="https://1611209449-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMvbOurypjZWfptd5H280%2Fuploads%2Fgit-blob-ff22bb8bd808bf0854be7f81ba06002bb9fcf3af%2Fimage.png?alt=media" alt=""><figcaption></figcaption></figure>

{% tabs %}
{% tab title="\_locales/en.json" %}

```json
{
    "manifest": {
        "app": {
            "name": "i18n example"
        }
    },
    "contextMenu": {
        "copy": "Copy",
        "paste": "Paste"
    }
}
```

{% endtab %}

{% tab title="\_locales/zh\_CN.json" %}

```json
{
    "manifest": {
        "app": {
            "name": "多国语言范例"
        }
    },
    "contextMenu": {
        "copy": "复制",
        "paste": "粘贴"
    }
}
```

{% endtab %}

{% tab title="\_locales/zh\_TW\.json" %}

```json
{
    "manifest": {
        "app": {
            "name": "多國語言範例"
        }
    },
    "contextMenu": {
        "copy": "複製",
        "paste": "貼上"
    }
}
```

{% endtab %}

{% tab title="\_locales/ja\_JP.json" %}

```json
{
    "manifest": {
        "app": {
            "name": "i18n の例"
        }
    },
    "contextMenu": {
        "copy": "コピー",
        "paste": "ペースト"
    }
}
```

{% endtab %}
{% endtabs %}

{% hint style="info" %}
現在サポートされている言語は `en`、`ja_JP`、`es_ES`、`de_DE`、`zh_TW`、`zh_CN`、`ko_KR`、`ru_RU` です。
{% endhint %}

## 手順3：`manifest.json`を調整する

Eagle Plugin の `i18next` 機能を使用すると、簡単な JSON ファイルで多言語アプリの翻訳を定義できます。

```json
{
    "id": "LE564883T24ZR",
    "version": "1.0.0",
    
    // 1. 名前を調整する
    "name": "{{manifest.app.name}}",
    "logo": "/logo.png",
    "keywords": [],
    
    // 2. サポートされている言語とデフォルト言語を設定する
    "fallbackLanguage": "zh_CN",
    "languages": ["en", "zh_TW", "zh_CN", "ja_JP"],
    
    "main": {
        "url": "index.html",
        "width": 640,
        "height": 480
    }
}
```

## 手順4：使用された文字列の変更

plugin.js を調整して、i18next メソッドで文字列を取得し、アラートします。

{% code title="plugin.js" %}

```javascript
eagle.onPluginCreate((plugin) => {

    // 多言語フィールドを取得
    let copyText = i18next.t('contextMenu.copy');
    let pasteText = i18next.t('contextMenu.paste');

    document.querySelector('#message').innerHTML = `
    <ul>
        <li>言語: ${eagle.app.locale}</li>
        <li>コピー: ${copyText}</li>
        <li>貼り付け: ${pasteText}</li>
    </ul>
    `;
});
```

{% endcode %}

## 手順5：アプリ言語を変更し、変更結果を確認

Eagleソフトウェアの言語設定を変更するには、次の手順に従ってください：画面で「Eagle」ボタンを見つけてクリックし、「環境設定」を選択、「一般」オプションをクリックし、「言語」セクションで必要な変更を行います。

<figure><img src="https://1611209449-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMvbOurypjZWfptd5H280%2Fuploads%2F7WAdNYfktiQJXrqzmKvt%2Fimage.png?alt=media&#x26;token=add11829-dfc6-48d2-a5b6-b55e99e01f2f" alt=""><figcaption><p>Switch application language</p></figcaption></figure>

<figure><img src="https://1611209449-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMvbOurypjZWfptd5H280%2Fuploads%2FuTJdsVxaHoFWNCJPdN9n%2Fimage.png?alt=media&#x26;token=a6bcc2db-582f-4799-8735-d0932bf22da0" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1611209449-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMvbOurypjZWfptd5H280%2Fuploads%2FUsALOOlKnbzRNy6fVvf4%2Fimage.png?alt=media&#x26;token=634a20a0-2d4d-4c9e-8e58-58e31680518b" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
**完全なサンプルコード：**

<https://github.com/eagle-app/eagle-plugin-examples/tree/main/i18n>
{% endhint %}

## 詳細な使い方を学ぶ

i18next には多くの便利な方法があり、さまざまな翻訳シナリオに簡単に対応できます。篇幅の都合上、ここでは主要な使用方法についてのみ説明しています。i18next の使い方や詳細な使い方を知りたい場合は、以下のリンクを参照してください：

* i18next 公式ドキュメント：<https://www.i18next.com/overview/getting-started>
* i18next の GitHub リポジトリ：<https://github.com/i18next/i18next>

公式ドキュメントを読むことで、i18next の基本的な概念と使い方を理解し、使用を開始するためのいくつかのサンプルコードを見つけることができます。GitHub リポジトリには、i18next のソースコードやその他のドキュメントが含まれており、実装の詳細をさらに理解したい場合は、そこで参照することができます。


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://developer.eagle.cool/plugin-api/ja-jp/tutorial/i18n.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.