react-i18next

i18next を使うと、React アプリケーションなどを簡単に多言語化できる。多言語化できるが、html の lang アトリビュートを自動で書き換えてくれたりはしない。

public/index.html

<!DOCTYPE html>
<html lang="en">
...
</html>

ここ。lang アトリビュートは、そもそも必要なのか？という話しもあるが、SEO 的には全く無意味らしいが、翻訳などの時に誤認識されることがあるようだし、設定しておいた方が良さそうだ。というわけで、設定する。

やり方

App.tsx

...
import i18next from 'i18next';
...
  i18next.on('languageChanged', (lng) => {
    document.documentElement.setAttribute('lang', lng);
  });

  return (...);

おしまい。