前提・実現したいこと
generateにて静的ファイルを出力した際に以下のようなページ構成にしたいです。
apple/index.html
apple/red/index.html
apple/red/like/index.html
apple/green/index/html
apple/green/unlike/index.html
watermeron/index.html
watermeron/yellow/index.html
watermeron/yellow/like/index.html
watermeron/purple/index.html
watermeron/purple/unlike/index.html
発生している問題・エラーメッセージ
dataからjsonを呼び出してrouteを記載しているのですがいまいち調べてもやり方がわかりません。 generateを行うと出力はされるのですが「apple/index.html], 「watermeron/index.html」しか出てきません。
該当のソースコード ※以下nuxt.config.jsです
const kudamonoList = require('./data/kudamono.json'); module.exports = { generate: { routes() { const i = []; kudamonoList.forEach(item => { i.push(`${item.id}`); i.push(`${item.id}/${item.color.id}}`); i.push(`${item.id}/${item.color.id}/${item.color.taste.id}}`); }); return i; } } }
jsonファイル
[ { "number": 1, "id": "apple", "color": [ { "id": "red", "taste": [ { "id":"like" } ] }, { "id":"green", "taste": [ { "id":"unlike" } ] } ] }, { "number": 2, "id": "watermeron", "color": [ { "id": "yellow", "taste": [ { "id":"like" } ] }, { "id":"purple", "taste": [ { "id":"unlike" } ] } ] } ]
以下ページ構成です
pages/index.vue
pages/_fruitsId/index.vue
pages/_fruitsId/_colorsId/index.vue
pages/_fruitsId/_colorsId/_choiceId/index.vue
ご教授願えますでしょうか?宜しくお願いいたします
あなたの回答
tips
プレビュー