nuxt 404 page not rendering on live version, but works in develop

I'm using nuxt generate option, and have a custom 404 page created with error.vue in layouts. In my nuxt.config.js I have the following:

generate: {
    exclude: [
      /styleguide$/,
      '/profile',
      '/schedule'
    ],
    fallback: '404.html'
  },

The 404 works like a charm on local dev, but not on live version. The website is deployed on s3 bucket. When I check my network, it returns status 200 when I hit non-existing route.

When i run generate in terminal I can see the following: Client-side fallback created: 404.html

I m trying to figuere out if I' m missing some configuration on cloudfront, or am I doing something wrong in nuxt?

Thank you so much in advance if anyone has any ideas, been stuck on it for days