WP REST APIを元にNuxt.jsのgenerateで記事ページを自動生成してみる（いわゆる動的ルーティング） | ARAKAZE NOTE

せっかくREST APIの情報を元にページを作るならgenerateするファイルは自動で出力したいですよね。 公式ドキュメントのところでいう「動的ルーティング」を使って実現してみましょう。 うまくいけばREST APIを元に自動でディレクトリ構造やhtmlファイルが生成されます。 考え方 nuxt.config.jsにgenerateプロパティを記述、そこに使用するAPI情報を読み込む記述をします。 ここでは読み込んだjsonの配列の中にある、ディレクトリ構造を示す値をrouteに設定していきます。 次に自動生成されるページ用のテンプレートファイルを作成します。 ディレクトリに対して細かく設定することも出来ますがWPのパーマリンクを元にする事を考えると「pages/_.vue」というファイルを作ってしまうのが手っ取り早いかなと思います。 テンプレートファイルは頭文字にアンダースコアを付ける