CloudFront+S3環境で Vue Nuxt の静的化ページでリロードした時にエラー（access denied)となる時の対処法

#CloudFront+S3の環境構築にデプロイ
nuxtアプリのmode: 'universal'モードにて
アプリケーションから静的ファイルを生成する。

npm run generate

静的なホスティングサイトにデプロイする準備が整ったものが全て入った dist フォルダが作成されます。

デプロイはAWS S3に先程生成されたファイルを配置することでデプロイできます。

##「/」以外のURLでリロードした場合に403(access denied)エラーとなる
This XML file does not appear to have any style information associated with it.!~~~~
AccessDenied
AccessDenied
#対応策
エラーの原因として対応するファイルがないため、ブラウザリロードすると 403 エラーになってしまうようです。

##CloudFrontのError Pagesで設定
403のときに/index.html（今回は「/」）へ転送するよう設定することでこの現象を回避することができます。
###Custom Error Response で追加設定
HTTP Error Code:　403:Forbidden
Error Caching Minimum TTL (seconds):　0
Customize Error Response:　Yes
Response Page Path:/
HTTP Response Code:　200:OK

以上の設定でリロードしてもエラーとならずページが表示されます。

こちらのサイトの記事を参考に解決することができました。
https://dev.classmethod.jp/cloud/aws/s3-cloudfront-spa-angular-403-access-denied/
ありがとうございます！！