いまのサイトホスティングに使っている、Firebase では /404.html があると 404 時に表示される。Firebase hosting の rewrite で /404.html があるように振る舞うマッピングしてもうまく行かず、実体としてのファイルが存在する必要がある。

そして使っている Next.js は /pages/404.tsx 的なファイルが有れば通常は /404.html が出力されるはずだけど、trailingSlash: true を指定している場合、/404/index.html の出力になってしまい、うまく Firebase で 404 ページが表示されない。

最初は next export した後ファイルをコピーして対応していたのだけど、exportPathMap で指定してやれば良いことに気づいた。

module.exports = {
  trailingSlash: true,
  exportPathMap: async function (
    defaultPathMap,
    { dev, dir, outDir, distDir, buildId }
  ) {
    return {
      ...defaultPathMap,
      "/404.html": { page: "/404" },
    }
  },
}

これで、/404.html が生成されるようになった。

あとは配信している /feed をちゃんとしたやり方で作りたいのだけど、Next.js で plain/text や xml など、html 以外を静的生成する方法が今の所解らない..