title: Error page not working on production mode on Nuxt.js
body: <p>I am developing an application with Nuxt in which I consume an API with dynamic query parameters.</p>
  <p>The website where the application is deployed only contains the query parameters if it is opened from another application.</p>
  <p>I want to redirect to an error page if the site url does not contain the query parameters to generate the json that the application consumes.</p>
  <p>I dont't undestand why the error page works as intended in development mode, but when I use the app in production mode the error page is not displayed.</p>
  <p>Am i missing something? or is there a better way to redirect to an error page if the API does not contain the query parameters?</p>
  <p>this is my index.vue from where I do the fetch to the dynamic API:</p>
  <pre class="lang-js prettyprint-override"><code>async created() {
      // GET request using fetch with async/await
      
      let uuidBooking = this.$route.query.uuidBooking;
      let nombreCliente = this.$route.query.nombreCliente;
  
        const response = await fetch(
        `https://e7pmpg7z85.execute-api.us-west-2.amazonaws.com/prod/obtienedatosbooking?uuidBooking=${uuidBooking}&amp;nombreCliente=${nombreCliente}`
      )
  
      const data = await response.json();
      console.log((JSON.parse(data.JsonBooking)));
      this.bookingData = JSON.parse(data.JsonBooking);
      
      if (response.uuidBooking === this.$route.query.uuidBooking &amp;&amp; response.nombreCliente === this.$route.query.nombreCliente) {
        this.response = response
      } else {
        // set status code on server and
        if (process.server) {
          this.$nuxt.context.response.statusCode = 404
        }
        // use throw new Error()
        throw new Error('Booking not found')
        // this.$nuxt.error({ message: 'Error test'})
      }
    },
  </code></pre>
  <p>I have also tried this with try and catch on the index.vue:</p>
  <pre class="lang-js prettyprint-override"><code>async created() {
      // GET request using fetch with async/await
      
      let uuidBooking = this.$route.query.uuidBooking;
      let nombreCliente = this.$route.query.nombreCliente;
  
      try {
        const response = await fetch(
        `https://e7pmpg7z85.execute-api.us-west-2.amazonaws.com/prod/obtienedatosbooking?uuidBooking=${uuidBooking}&amp;nombreCliente=${nombreCliente}`
      )
  
      const data = await response.json();
      console.log((JSON.parse(data.JsonBooking)));
      this.bookingData = JSON.parse(data.JsonBooking);
  
      } catch (error) {
        context.error(error)
      }
  }
  </code></pre>
  <p>this is my error page:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;template&gt;
    &lt;b-container class=&quot;error-container d-flex flex-column align-items-center justify-content-center&quot;&gt;
      &lt;div class=&quot;text-center p-3&quot;&gt;
        &lt;h1 v-if=&quot;error.statusCode === 404&quot;&gt;Page not found&lt;/h1&gt;
        &lt;h1 v-else&gt;We couldn't find any information for this request.&lt;/h1&gt;
        &lt;a href=&quot;mailto:help@exikhan.com.mx&quot; class=&quot;email-link&quot;&gt;Get in touch: help@exikhan.com.mx&lt;/a&gt;
        &lt;!-- &lt;NuxtLink to=&quot;/&quot;&gt;Home page&lt;/NuxtLink&gt; --&gt;
      &lt;/div&gt;
    &lt;/b-container&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
    props: [&quot;error&quot;],
    // layout: &quot;blog&quot;, // you can set a custom layout for the error page
  };
  &lt;/script&gt;
  </code></pre>