🌍

next-i18nで型推論を有効にする

2023/04/18に公開

やりたいこと

下記のように、該当 namespace の json ファイル内に存在する key を推論し、key の指定間違えを防ぎたいです。

// locales/ja/greeting.json
{
  "hello" : "こんにちは"
}

// home.tsx
const { t } = useTranslation("greeting");
// type error
t("email");
// success
t("hello");

設定方法

next-i18next.d.tsファイルを作成し、CustomTypeOptions インターフェースを上書きします。

import "i18next";
import greeting from "locales/ja/greeting.json";

declare module "i18next" {
  interface CustomTypeOptions {
    defaultNS: "translate";
    resources: {
      greeting: typeof greeting;
    };
  }
}
GitHubで編集を提案

Discussion