Nuxt.jsで静的ページとしてアプリケーションを配信するときはgenerateモードでビルドすることで、個別のHTMLファイルとjavascriptファイルとして生成されます。ただし、ルーティングが動的に生成されている場合には、個別のHTMLとして生成されないため、直接URLを叩いてアクセスしたり、ページをリロードした場合にはNotFoundとして404エラーが返されてしまいます。   公式のドキュメントを見ると、「generate コマンドでは 動的なルーティング は無視されます。」と記載されており、どうやら対応が必要だそうです。動的ルーティングが発生するケースはどういった時かというと、下記のようなルーティングの構成で、「_id.vue」というファイルを使うことでURLのパスが変わるケースになります。

pages
 ┣ index.vue
 ┣ page-01
  ┗ index.vue
 ┣ page-02
  ┗ index.vue
 ┗ posts
  ┗ _id.vue

  この場合に、そのままgenerateコマンドを実行すると、distフォルダに生成されるファイル群は下記のようになります。

// 一部抜粋
dist 
 .......
 ┣ _nuxt
 ┣ index.html
 ┣ page-01
  ┗ index.html
 ┣ page-02
  ┗ index.html

  動的にルーティングされているページに関しては、ファイルが生成されないようです。そこで下記のように「nuxt.config.js」ファイルへの設定を行う必要があります。 【nuxt.config.js】※一部抜粋

export default {
 .......
 generate: {
  routes: [
   '/posts/post-01',
   '/posts/post-02',
   '/posts/post-03',
   '/posts/post-04',
   .......
  ]
 }
 .......
}

  「generateプロパティ」の「routes」の値に配列の形でルーティングを追記していきます。こうすることで動的なルーティングでも個別ファイルとして生成することができます。実際にgenerateコマンドを実行すると、動的なルーティングで表示されるページも個別ファイルとして書き出されているのが確認できます。

// 一部抜粋
dist 
 .......
 ┣ _nuxt
 ┣ index.html
 ┣ page-01
  ┗ index.html
 ┣ page-02
  ┗ index.html
 ┣ posts
  ┣ post-01
   ┗ index.html
  ┣ post-02
   ┗ index.html
  ┣ post-03
   ┗ index.html
  .......

  公式ドキュメントにはきちんと記載されているのですが、知らないと結構悩むのではないでしょうか、、やはりわからないことがあるとまずは公式ドキュメントに目を通すのが大事だと改めて思いましたね。   （参考にさせて頂いたサイト） Nuxt.js generate プロパティ