How do I render a 404 page in NextJS in development and production? - http-status-code-404

Question

I have a situation where I am using nextjs for client-side and the '404 - page not found error' only appears in local development, but I would like to see it on dev and on production.
How can I archive this?
Found some examples on the net that worked well locally but didn't work again on dev and prod since I could get the statusCode locally from ctx.res.statusCode from the getInitialProps method in _app.js and display the default nextjs Error component if the status code is 404.
I also created a custom _errors.js page, but this also works in local dev only
Reusing the built-in error page :
import App, { Container } from 'next/app';
import { ApolloProvider } from 'react-apollo';
import Error from 'next/error';
import Page from '../components/Page';
import withData from '../lib/withData';
class MyApp extends App {
static async getInitialProps({ Component, ctx }) {
let pageProps = {};
if (Component.getInitialProps) {
pageProps = await Component.getInitialProps(ctx);
}
const { res } = ctx;
const errorCode = res.statusCode > 200 ? res.statusCode : false;
pageProps.query = ctx.query;
return {
pageProps,
errorCode,
};
}
render() {
const { Component, apollo, pageProps, errorCode } = this.props;
if (errorCode) {
return <Error statusCode={errorCode} />;
}
return (
<Container>
<ApolloProvider client={apollo}>
<Page>
<Component {...pageProps} />
</Page>
</ApolloProvider>
</Container>
);
}
}
export default withData(MyApp);
Custom error handling solution :
import React from 'react';
import PropTypes from 'prop-types';
class Error extends React.Component {
static getInitialProps({ res, err }) {
let errCode = null;
if (res.statusCode) {
errCode = res.statusCode;
} else if (err.statusCode) {
errCode = err.statusCode;
}
return { errCode };
}
render() {
const { errCode } = this.props;
return <p>{errCode ? `An error ${errCode} occurred on server` : 'An error occurred on client'}</p>;
}
}
Error.propTypes = {
errCode: PropTypes.number,
};
export default Error;