[Nuxt.js]動的なルーティングを含めてgenerateする方法

2022/05/29

#Vue.js/Nuxt.js

Nuxt.jsでMicroCMSから投稿データを取ってきてgenerateの時に書き出すみたいなことが必要になったので備忘録としてやり方を残しておきます。

やり方


nuxt.config.jsのgenerate→routes関数の中で書き出したいURL一覧をリスト形式でreturnするとgenerateで書き出されます。

例えば
/post/hoge
/post/hoge2
を書き出す対象に含めたい場合は

generate:{
    routes(){
        return ["/post/hoge","/post/hoge2"]
    }
}


みたいに書くことで書き出されます。
routesの中にaxiosでAPIを叩くコードを書けばmicroCMSから投稿一覧を引っ張ってくることもできます。


関連記事:Vue.js/Nuxt.js

Nuxt.js + microCMS + Nuxt Contentでブログを作り直してみた

Vue.js/Nuxt.js

[Nuxt.js]nuxt.config.jsに環境変数を定義してプログラムから読み込む方法

Vue.js/Nuxt.js

Cloudflare PagesにNuxtのプロジェクトをデプロイしようとしたところSyntaxErrorが発生したので対処法をメモ

Vue.js/Nuxt.js