title: nuxt generate throws error for dynamic page nuxt.js
body: <p>I can not seem to figure out what the issue is here...</p>
  
  <p>I have created a blog with pagination using nuxt.js now in my <code>nuxt.config.js</code> I have a method that gets the posts from contentful like so</p>
  
  <pre><code>const getBlogPosts = async () =&gt; {
    let blogPosts = await client.getEntries({ order: '-sys.createdAt', limit: 1000, content_type: config.CTF_BLOG_POST });
    return blogPosts;
  };
  </code></pre>
  
  <p>then when I generate the routes I do the following...</p>
  
  <pre><code>generate: {
      routes: async () =&gt; {
        const posts = await getBlogPosts();
        const routes = [];
        let postsNum = Math.ceil(posts.items.length / 10); // get the page numbers
        for (let i = 1; i &lt;= postsNum; i++) {
          routes.push({
            route: '/page/' + i,
            payload: {
              data: posts.items.splice(i === 1 ? 0 : i * 10, 10)
            }
          });
        }
        return routes;
      }
    },
  </code></pre>
  
  <p>then in my <code>_page/index.vue</code></p>
  
  <p><a href="https://i.stack.imgur.com/EiSDn.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/EiSDn.png" alt="enter image description here"></a></p>
  
  <pre><code>&lt;script&gt;
  export default {
      components: {
       //...
      },
      aysnc asyncData(context) {
          if(context.payload) {
              return {
                  blogPosts: context.payload.data.items.slice(0, 8)
              }
          } else {
              //...
          }
      }
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>now when Im running this locally the page works fine no errors etc.. but on <code>nuxt generate</code> I get </p>
  
  <p><code>ERROR: Error generating /page/1</code></p>
  
  <p>now I've tried to <code>console.log()</code> the blogPosts on <code>mounted()</code> but It never fires.</p>
  
  <p>I can not figure out what is wrong here, Ive tried to strip back everything and made my <code>_page/index.vue</code> to look like this</p>
  
  <pre><code>&lt;template&gt;
      &lt;div&gt;
          &lt;h1&gt;hello&lt;/h1&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
  
  }
  &lt;/script&gt;
  
  &lt;style&gt;
  
  &lt;/style&gt;
  </code></pre>
  
  <p>but I still get the generate error I've <code>console.log()</code> routes and I get this</p>
  
  <pre><code>[                                                                                                 11:39:44  
    {
      route: '/page/1',
      payload: {
        data: [Array]
      }
    }
  ]
  </code></pre>
  
  <p>which looks correct, so why is the page erroring??</p>
  
  <p><strong>edit 1</strong></p>
  
  <p>When I check my dist folder the page 1 index.html is there but in the html it says <code>this page could not be found</code></p>
  
  <p>any help would be appreciated thanks or is there a way to get a better error message</p>
  
  <p><strong>edit 2</strong></p>
  
  <p>All of my individual blog pages build correctly, but the actual /page/1 is the only one that is failing I have put a try catch around the whole async generate method and there are no errors.. also If I console.log all the routes it appears as if it is all correct</p>
  
  <pre><code>[                                                                                                 08:58:38
    {
      route: '/blog/6gQUEUwex7mjNtAXY4ZlTO',
      payload: {
        data: [Object]
      }
    },
    {
      route: '/blog/2xDAv0zSt4kUfxOV1XC98C',
      payload: {
        data: [Object]
      }
    },
    {
      route: '/blog/6f6shGDflvuBUMZn25sIbE',
      payload: {
        data: [Object]
      }
    },
    {
      route: '/blog/24Sov29BazGj52WEQdJGiy',
      payload: {
        data: [Object]
      }
    },
    {
      route: '/blog/r2ky97Vg8u6rouiVXdSzd',
      payload: {
        data: [Object]
      }
    },
    {
      route: '/blog/2QnIl7GOScQ31A7EcRVgT1',
      payload: {
        data: [Object]
      }
    },
    {
      route: '/blog/1bEUOT5Xnm7CU9Njd5xkeu',
      payload: {
        data: [Object]
      }
    },
    {
      route: '/blog/7FUON1DcQcGQnvdp7Kxfbe',
      payload: {
        data: [Object]
      }
    },
    {
      route: '/page/1',
      payload: {
        data: [Array]
      }
    }
  ]
  </code></pre>
  
  <p>all of the other pages are generated correctly</p>