C++ ときどき ごはん、わりとてぃーぶれいく☆

USAGI.NETWORKのなかのひとのブログ。主にC++。

Electron アプリに i18next を追加して i18n/l10n 対応するメモ

Electron i18n l10n i18next example how to tips

基本的な使用の流れ

  1. yarn add i18next i18next-node-fs-backend
  2. public/i18n.js など適当に作り
  3. l10n 文字列を取り出したいソースで const i18n = require('./i18n.js') して
  4. 必要なら await i18n.changeLanguage('ja-JP') のように l10n 先を実行時に設定する仕込みをして
  5. i18n.t('hoge') とすると i18next で l10n した文字列を取り出せます
  6. i18next の options で渡す loadPath に JSON で { "hoge": "ほげ" } のように key-value 的に l10n リソースを定義追加します。saveMissing を true にしておけば addPath で与える missing 用のファイルへ l10n リソースが未定義で実行時に要求された文字列のリストが保存されます。

public/i18n.js

  • Note
    • ファイル名や配置はお好みで。
    • options は Configuration Options - i18next documentation を見て適当に。
    • fallbackLng を定義すると、 missing による add 動作先も fallbackLng になりました。未設定にしておけば missing による add は dev.missing.json のように addPath で与える {{lng}} は dev になります。
const i18n = require("i18next");
const i18n_backend = require("i18next-node-fs-backend");
const path = require("path");
// const is_dev = require("electron-is-dev");

const options = {
 // debug: is_dev,
 lng: "en-US",
 initImmediate: false,
 backend: {
  loadPath: path.resolve(__dirname, "..", "i18n/{{lng}}.json"),
  addPath: path.resolve(__dirname, "..", "i18n/{{lng}}.missing.json"),
  jsonIndent: 2,
 },
 saveMissing: is_dev,
 // fallbackLng: "en-US",
 whiteList: [
  "en-US",
  "ja-JP",
  //, "ko-KR"
  //, "zh-CN"
  //, "zh-TW"
  //, "zh-HK"
 ],
};

i18n.use(i18n_backend);

if (!i18n.isInitialized) i18n.init(options);

module.exports = i18n;

i18n/ja-JP.json の例

  • Note: ファイル名と配置は i18next へ与える options で任意に設定できるのでお好みで。
{ "hoge": "ほげ" }

参考