FirebaseUI x Next.js: 日本語対応どうしたらいいの?

1 min読了の目安(約800字TECH技術記事

FirebaseUI x Next.js: 日本語対応どうしたらいいの?

悩み

ドキュメント通り設定すると、以下のように英語表記で表示されてしまいます。
"うちのサービス日本語で展開してるんだけど" という方も多いと思います。

今回は、私が対応した日本語化の手順について残したいと思います。

手順

前提

  • 今回はNext.js 環境化で行います
  • react-firebaseui が既に導入されているものとします。

1. 必要なライブラリをインストール

yarn add firebaseui-ja
yarn add -D webpack-merge

2. next.config.js をカスタマイズ

const { merge } = require('webpack-merge');

const nextConfig = {
  distDir: "./.next",
  webpack: (config) => {
    return (merge(config, {
      resolve: {
        alias: {
          firebaseui: "firebaseui-ja"
        }
      }
    }))
  }
}

module.exports = nextConfig

以上で、日本語対応は完了となります。