Use redirect page as error page

A [recent change](vercel/next.js#2973) in Next allowed for paths to be exported directly, meaning we can now generate 404.html straight from the config. This changes the build to use the redirect page to generate 404.html directly.
rosszurowski · Oct 9, 2017 · f84ba20 · f84ba20
1 parent d81ab39
commit f84ba20
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 28 deletions.
diff --git a/next.config.js b/next.config.js
@@ -10,12 +10,15 @@ const getLogPaths = async () => {
 
 module.exports = {
   async exportPathMap() {
-    const staticPaths = ['/', '/2017/japan', '/100', '/_error'];
+    const staticPaths = ['/', '/2017/japan', '/100'];
+    const customPaths = {
+      '/404.html': { page: '_redirect' },
+    };
 
     const logPaths = await getLogPaths();
 
     const paths = staticPaths.concat(logPaths);
-    const pathMap = pathsToPages(paths);
+    const pathMap = { ...customPaths, ...pathsToPages(paths) };
 
     return pathMap;
   },

diff --git a/package.json b/package.json
@@ -5,10 +5,10 @@
   "scripts": {
     "prebuild": "yarn build:css",
     "build": "NODE_ENV=production next build && next export -o dist",
-    "postbuild": "yarn build:404 && yarn build:dat",
-    "build:404": "mv dist/_error/index.html dist/404.html && rm -r dist/_error",
+    "postbuild": "yarn build:dat",
     "build:css": "mkdir -p static/css/ && node css.js > static/css/index.css",
-    "build:dat": "cp dat.json dist/dat.json && mkdir -p dist/.well-known && touch dist/.well-known/dat && echo $(node -p 'require(\"./dat.json\").url') > dist/.well-known/dat && echo \"TTL=0\" >> dist/.well-known/dat",
+    "build:dat":
+      "cp dat.json dist/dat.json && mkdir -p dist/.well-known && touch dist/.well-known/dat && echo $(node -p 'require(\"./dat.json\").url') > dist/.well-known/dat && echo \"TTL=0\" >> dist/.well-known/dat",
     "start": "next"
   },
   "dependencies": {

diff --git a/pages/_error.js b/pages/_error.js
diff --git a/pages/_redirect.js b/pages/_redirect.js
@@ -20,12 +20,16 @@ export default class Redirect extends Component<Props> {
     return (
       <Page titleOverride="Redirecting...">
         <Head>{IS_PRODUCTION && <meta httpEquiv="refresh" content={`0;url=${this.props.redirectPath}`} />}</Head>
-        <div className="pa-4">
-          <p className="ff-sans">Just a sec, redirecting you...</p>
-          {!IS_PRODUCTION && (
-            <p>
-              No redirects in dev. <a href={this.props.redirectPath}>Go here</a>
-            </p>
+        <div className="ff-sans pa-4">
+          {IS_PRODUCTION ? (
+            <p>Just a sec, redirecting you...</p>
+          ) : (
+            <div>
+              <p>Redirect page disabled in dev.</p>
+              <p className="mt-3 h-fade">
+                <a href={this.props.redirectPath}>Go here &rarr;</a>
+              </p>
+            </div>
           )}
         </div>
       </Page>