Nuxt.js で作成した静的サイトを S3 + CloudFront でホスティングするパターン

Nuxt.js で SSR を使わない静的サイトを生成(nuxt generate)して S3 で安価にホスティングする場合、「各ページに対して index.html ファイルが生成されるが、リンクの URL では index.html は省略されるため、そのままでは Not Found になってしまう」という課題がある。通常の Web サーバーには、例えば Apache では DocumentIndex、nginx では index というように、ファイル名が省略された場合にデフォルトのファイル名を配信する設定があるが、それ相当の動作が必要となる。 実現方法にはいくつかパターンがあるようなので、詳細はそれぞれの解説ページに任せるとして、それらを整理してみた。 参考 CloudFront + S3 で静的サイトを運用する際の注意点 - Qiita 構成パターン 1. S3 で Static