return a static 404 page when a route cannot be found

[lone-cloud]

fixes #378

According to https://nextjs.org/docs/advanced-features/custom-error-page#404-page the 404 page is "statically generated at build time". As such, it cannot be SSR'ed and is expected to be returned when a route cannot be found. Whereas _error.js can only be SSR'ed and is expected to handle other kinds of errors.

Impact
This approach will be a slight regression for those looking to localize their 404 pages. On the server side, one could previously read the language cookie (or something similar) and set the page locale based on that. Always returning a static 404.html page means that a client-side implementation will be required which is going to feel bad.... or maybe don't even worry about localizing 404 pages. Next.js does not currently provide a good way to localize apps. :(

[danielcondemarin]

Thanks again 🙌

I wonder if we could make this change backward compatible the same way next announced it,

This feature is fully backwards compatible so if you currently have a custom pages/_error.js it will continue to be used for the 404 page until you add pages/404.js.

Also, do you know if 404.html is always produced on build, even when users are still using _error.js for 404s?

[lone-cloud]

Thanks again 🙌

I wonder if we could make this change backward compatible the same way next announced it,

This feature is fully backwards compatible so if you currently have a custom pages/_error.js it will continue to be used for the 404 page until you add pages/404.js.

Also, do you know if 404.html is always produced on build, even when users are still using _error.js for 404s?

Looks like it is not produced in that case. The build output suggests that for that scenario (_error defined, but no 404) the 404 page should be SSR'ed from a lambda. damn
I think the low-hanging fruit solution is what you suggested in the PR: lone-cloud@834886a#diff-867646f333d11e3bbfc6d2da7ffb967f
The more idiomatic Next.js way seems to be to conditionally return error.js if 404.html was not created, but I'm not 100% how that implementation would look like here.
Thoughts?

[danielcondemarin]

Thanks again 🙌
I wonder if we could make this change backward compatible the same way next announced it,

This feature is fully backwards compatible so if you currently have a custom pages/_error.js it will continue to be used for the 404 page until you add pages/404.js.

Also, do you know if 404.html is always produced on build, even when users are still using _error.js for 404s?

Looks like it is not produced in that case. The build output suggests that for that scenario (_error defined, but no 404) the 404 page should be SSR'ed from a lambda. damn
I think the low-hanging fruit solution is what you suggested in the PR: lone-cloud@834886a#diff-867646f333d11e3bbfc6d2da7ffb967f
The more idiomatic Next.js way seems to be to conditionally return error.js if 404.html was not created, but I'm not 100% how that implementation would look like here.
Thoughts?

In the default-handler you could check the manifest.json for a 404.html page entry, if there is one use it, otherwise fall back to _error.js.

This is an example .serverless_nextjs/default-lambda/manifest.json where 404.html is available:

{
  "buildId": "Sl-G_UYjxcrPfbonpj6nd",
  "pages": {
    "ssr": {
      "dynamic": {},
      "nonDynamic": {
        "/_error": "pages/_error.js",
        "/todos": "pages/todos.js",
        "/_app": "pages/_app.js",
        "/_document": "pages/_document.js"
      }
    },
    "html": {
      "dynamic": {},
      "nonDynamic": {
        "/todos/new": "pages/todos/new.html",
        "/404": "pages/404.html"
      }
    }
  },
  "publicFiles": {}
}

[danielcondemarin]

FYI - I've PR'ed a fix to remove the default statusCode from the response. #437

[lone-cloud]

FYI - I've PR'ed a fix to remove the default statusCode from the response. #437

Nice, I've done that in a local commit too, but I need to finish writing/fixing tests. Will come back to finish this PR later this week.

[danielcondemarin]

Looks good 👍 I'll be testing it tonight.