From 76bfc38a095a65600793b7c6bbfa97f7145cc328 Mon Sep 17 00:00:00 2001
From: Arunoda Susiripala <arunoda.susiripala@gmail.com>
Date: Wed, 5 Apr 2017 17:13:34 +0530
Subject: [PATCH] Remove all the inline code.

---
 client/index.js    | 10 +++++++++-
 server/document.js | 15 +++------------
 server/index.js    | 12 ++++++++++++
 server/render.js   | 30 ++++++++++++++++++++++++------
 4 files changed, 48 insertions(+), 19 deletions(-)

diff --git a/client/index.js b/client/index.js
index fc32fc6e..bf5cb423 100644
--- a/client/index.js
+++ b/client/index.js
@@ -35,7 +35,15 @@ if (window.NEXT_LOADED_PAGES) {
 }
 
 const ErrorComponent = pageLoader.loadPageSync('/_error')
-const Component = pageLoader.loadPageSync(pathname) || ErrorComponent
+let Component
+
+try {
+  Component = pageLoader.loadPageSync(pathname)
+} catch (err) {
+  console.error(`${err.message}\n${err.stack}`)
+  Component = ErrorComponent
+}
+
 let lastAppProps
 
 export const router = createRouter(pathname, query, getURL(), {
diff --git a/server/document.js b/server/document.js
index 6bc92371..7160aeeb 100644
--- a/server/document.js
+++ b/server/document.js
@@ -95,25 +95,16 @@ export class NextScript extends Component {
     return this.getChunkScript('app.js', { async: true })
   }
 
-  getMainComponents () {
-    const { component, errorComponent } = this.context._documentProps
-
-    return (
-      <div>
-        <script dangerouslySetInnerHTML={{ __html: component }} />
-        <script dangerouslySetInnerHTML={{ __html: errorComponent }} />
-      </div>
-    )
-  }
-
   render () {
     const { staticMarkup, __NEXT_DATA__ } = this.context._documentProps
+    const { pathname, buildId } = __NEXT_DATA__
 
     return <div>
       {staticMarkup ? null : <script dangerouslySetInnerHTML={{
         __html: `__NEXT_DATA__ = ${htmlescape(__NEXT_DATA__)}; module={};`
       }} />}
-      {staticMarkup ? null : this.getMainComponents()}
+      <script type='text/javascript' src={`/_next/${buildId}/page${pathname}`} />
+      <script type='text/javascript' src={`/_next/${buildId}/page/_error`} />
       {staticMarkup ? null : this.getScripts()}
     </div>
   }
diff --git a/server/index.js b/server/index.js
index 16a4b7f4..5360ed86 100644
--- a/server/index.js
+++ b/server/index.js
@@ -114,6 +114,18 @@ export default class Server {
         await this.serveStatic(req, res, p)
       },
 
+      '/_next/:buildId/page/_error': async (req, res, params) => {
+        if (!this.handleBuildId(params.buildId, res)) {
+          const error = new Error('INVALID_BUILD_ID')
+          const customFields = { buildIdMismatched: true }
+
+          return await renderScriptError(req, res, '/_error', error, customFields, this.renderOpts)
+        }
+
+        const p = join(this.dir, '.next/client-bundles/pages/_error.js')
+        await this.serveStatic(req, res, p)
+      },
+
       '/_next/:buildId/page/:path*': async (req, res, params) => {
         const paths = params.path || ['']
         const page = `/${paths.join('/')}`
diff --git a/server/render.js b/server/render.js
index 6020eeb3..e0c36c6c 100644
--- a/server/render.js
+++ b/server/render.js
@@ -131,10 +131,19 @@ export async function renderScriptError (req, res, page, error, customFields, op
   if (error.code === 'ENOENT') {
     res.setHeader('Content-Type', 'text/javascript')
     res.end(`
-      var error = new Error('Page not exists: ${page}')
-      error.pageNotFound = true
-      error.statusCode = 404
-      NEXT_PAGE_LOADER.registerPage('${page}', error)
+      function loadPage () {
+        var error = new Error('Page not exists: ${page}')
+        error.pageNotFound = true
+        error.statusCode = 404
+        NEXT_PAGE_LOADER.registerPage('${page}', error)
+      }
+      
+      if (window.NEXT_PAGE_LOADER) {
+        loadPage()
+      } else {
+        window.NEXT_LOADED_PAGES = window.NEXT_LOADED_PAGES || []
+        window.NEXT_LOADED_PAGES.push(loadPage)
+      }
     `)
     return
   }
@@ -146,8 +155,17 @@ export async function renderScriptError (req, res, page, error, customFields, op
   }
 
   res.end(`
-    var error = ${JSON.stringify(errorJson)}
-    NEXT_PAGE_LOADER.registerPage('${page}', error)
+    function loadPage () {
+      var error = ${JSON.stringify(errorJson)}
+      NEXT_PAGE_LOADER.registerPage('${page}', error)
+    }
+    
+    if (window.NEXT_PAGE_LOADER) {
+      loadPage()
+    } else {
+      window.NEXT_LOADED_PAGES = window.NEXT_LOADED_PAGES || []
+      window.NEXT_LOADED_PAGES.push(loadPage)
+    }
   `)
 }