atinux / nuxt-prismic-showcase

Showcase of Nuxt.js + Prismic.io CMS
https://nuxt-prismic.surge.sh/
50 stars 9 forks source link

Generating routes that aren't found in crawling the pages #4

Closed jamielovelace closed 4 years ago

jamielovelace commented 4 years ago

How does the crawler / static module work — I'm a bit confused, my application (follows the same structure as this) and will only generate routes if they are either Single pages, or found to have a link to them from some other part of the app.

Is there a way of getting nuxt generate to create all of the routes, e.g if i have a folder called 'my-folder' that contains a _uid.vue file in there - can nuxt generate every detect that exists or would i have to specify those routes in the build command in the config?

Bergrebell commented 4 years ago

@jamielovelace - have you found a solution? i'm having the same issue.

jamielovelace commented 4 years ago

I had to just specify the routes in the nuxt.config.js in the end. Exactly like this: https://nuxtjs.org/api/configuration-generate/#speeding-up-dynamic-route-generation-with-code-payload-code-

specific case for Prismic is kinda like this: nuxt.config.js

const Prismic = require('prismic-javascript')

const api = req => {
  return Prismic.getApi(PrismicConfig.baseUrl, {
    req: req
  })
}

module.exports = {
  generate: {
    routes: function () {
      const postType1 = initApi().then(api => {
        return api.query(Prismic.Predicates.at('document.type', 'post_type_1'))
          .then(response => {
            return response.results.map(payload => {
              return `/foo/${payload.uid}`
            })
          })
      })

      const postType2 = initApi().then(api => {
        return api.query(Prismic.Predicates.at('document.type', 'post_type_2'))
          .then(response => {
            return response.results.map(payload => {
              return `/bar/${payload.uid}`
            })
          })
      })

      const results = [
        postType1,
        postType2
      ]
      return Promise.all(results).then(values => {
        let allRoutes = []
        values.forEach(value => {
          allRoutes.push(...value)
        })
        return allRoutes
      })
    }
  }
}
Bergrebell commented 4 years ago

thanks a lot for the detailed explanation / example.

atinux commented 4 years ago

If you don't link to them with a <nuxt-link>, you will have to use generate.routes indeed :)

Bergrebell commented 4 years ago

@jamielovelace did you implement it that way in your application? and is it working?

i'm getting FetchErrors with multiple pages if i run the queries.

FetchError: request to https://OUR-PRISMIC.cdn.prismic.io/api/v2/documents/search?page=1&pageSize=1&ref=[...] failed, reason: socket hang up

FetchError: request to https://OUR-PRISMIC.cdn.prismic.io/api/v2/documents/search?page=1[...] failed, reason: read ECONNRESET

any idea why?

it worked fine until we got to ~50 pages.