From becf2f2a6242a71e3b17f2962ab32b2ee806aa11 Mon Sep 17 00:00:00 2001
From: Florian Didron <florian@111studio.jp>
Date: Wed, 16 Nov 2016 11:46:58 +0900
Subject: [PATCH 01/18] Adds friendly error plugin

---
 package.json            |  3 ++-
 server/build/webpack.js |  6 +++++-
 server/hot-reloader.js  | 19 ++-----------------
 3 files changed, 9 insertions(+), 19 deletions(-)

diff --git a/package.json b/package.json
index 8bd0a7b6..e63c6f12 100644
--- a/package.json
+++ b/package.json
@@ -53,6 +53,7 @@
     "babel-runtime": "6.11.6",
     "cross-spawn": "4.0.2",
     "del": "2.2.2",
+    "friendly-errors-webpack-plugin": "1.1.0",
     "glamor": "2.17.10",
     "glob-promise": "1.0.6",
     "htmlescape": "1.1.1",
@@ -66,11 +67,11 @@
     "react-dom": "15.3.2",
     "react-hot-loader": "3.0.0-beta.6",
     "send": "0.14.1",
+    "sockjs-client": "1.1.1",
     "strip-ansi": "3.0.1",
     "url": "0.11.0",
     "webpack": "1.13.2",
     "webpack-dev-server": "1.16.2",
-    "sockjs-client": "1.1.1",
     "write-file-webpack-plugin": "3.3.0"
   },
   "devDependencies": {
diff --git a/server/build/webpack.js b/server/build/webpack.js
index cae825f9..6b478243 100644
--- a/server/build/webpack.js
+++ b/server/build/webpack.js
@@ -7,6 +7,7 @@ import WatchPagesPlugin from './plugins/watch-pages-plugin'
 import WatchRemoveEventPlugin from './plugins/watch-remove-event-plugin'
 import DynamicEntryPlugin from './plugins/dynamic-entry-plugin'
 import DetachPlugin from './plugins/detach-plugin'
+import FriendlyErrorsWebpackPlugin from 'friendly-errors-webpack-plugin'
 
 export default async function createCompiler (dir, { hotReload = false } = {}) {
   dir = resolve(dir)
@@ -49,7 +50,10 @@ export default async function createCompiler (dir, { hotReload = false } = {}) {
     new DynamicEntryPlugin(),
     new UnlinkFilePlugin(),
     new WatchRemoveEventPlugin(),
-    new WatchPagesPlugin(dir)
+    new WatchPagesPlugin(dir),
+    new FriendlyErrorsWebpackPlugin({
+      messages: ['Your application is running here http://localhost:3000']
+    })
   ] : [
     new webpack.optimize.UglifyJsPlugin({
       compress: { warnings: false },
diff --git a/server/hot-reloader.js b/server/hot-reloader.js
index eb776e7f..5b6fca16 100644
--- a/server/hot-reloader.js
+++ b/server/hot-reloader.js
@@ -82,23 +82,8 @@ export default class HotReloader {
       publicPath: '/',
       hot: true,
       noInfo: true,
-      clientLogLevel: 'warning',
-      stats: {
-        assets: false,
-        children: false,
-        chunks: false,
-        color: false,
-        errors: true,
-        errorDetails: false,
-        hash: false,
-        modules: false,
-        publicPath: false,
-        reasons: false,
-        source: false,
-        timings: false,
-        version: false,
-        warnings: false
-      }
+      quiet: true,
+      clientLogLevel: 'warning'
     })
   }
 

From 825d1878ffbdb71774e0adf9a9453acbed0d5ed3 Mon Sep 17 00:00:00 2001
From: Florian Didron <florian@111studio.jp>
Date: Wed, 16 Nov 2016 13:05:19 +0900
Subject: [PATCH 02/18] Removes unecessary and undisplayed default message

---
 server/build/webpack.js | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/server/build/webpack.js b/server/build/webpack.js
index 6b478243..af7e0053 100644
--- a/server/build/webpack.js
+++ b/server/build/webpack.js
@@ -51,9 +51,7 @@ export default async function createCompiler (dir, { hotReload = false } = {}) {
     new UnlinkFilePlugin(),
     new WatchRemoveEventPlugin(),
     new WatchPagesPlugin(dir),
-    new FriendlyErrorsWebpackPlugin({
-      messages: ['Your application is running here http://localhost:3000']
-    })
+    new FriendlyErrorsWebpackPlugin()
   ] : [
     new webpack.optimize.UglifyJsPlugin({
       compress: { warnings: false },

From 89850322df0c1a1034bd02e336ad1712aea7b1ad Mon Sep 17 00:00:00 2001
From: Timothy <CodeTheory@users.noreply.github.com>
Date: Wed, 23 Nov 2016 15:56:47 +0000
Subject: [PATCH 03/18] Remove `developers` from LICENSE file (#290)

---
 LICENSE | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/LICENSE b/LICENSE
index 991620e1..69b61253 100644
--- a/LICENSE
+++ b/LICENSE
@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) 2016 Zeit, Inc. developers 
+Copyright (c) 2016 Zeit, Inc.
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

From 3a6dd325a1cb84e8e288b251e0aa3a2d6ca2504a Mon Sep 17 00:00:00 2001
From: Leo Lamprecht <mindrun@icloud.com>
Date: Wed, 23 Nov 2016 16:57:47 +0100
Subject: [PATCH 04/18] Rename LICENSE to LICENSE.md

---
 LICENSE => LICENSE.md | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename LICENSE => LICENSE.md (100%)

diff --git a/LICENSE b/LICENSE.md
similarity index 100%
rename from LICENSE
rename to LICENSE.md

From a14cc667204501de7eea5b561e0083a609473557 Mon Sep 17 00:00:00 2001
From: Naoyuki Kanezawa <naoyuki.kanezawa@gmail.com>
Date: Thu, 24 Nov 2016 03:32:49 +0900
Subject: [PATCH 05/18] Remove webpack-dev-server (#276)

* remove webpack-dev-server

* webpack: fix publicPath
---
 client/next-dev.js                         |   1 -
 client/webpack-dev-client/index.js         | 167 ---------------------
 client/webpack-dev-client/socket.js        |  39 -----
 client/webpack-hot-middleware-client.js    |  30 ++++
 package.json                               |   4 +-
 server/build/plugins/watch-pages-plugin.js |   4 +-
 server/build/webpack.js                    |   6 +-
 server/hot-reloader.js                     |  55 ++++---
 server/index.js                            |   4 +
 9 files changed, 74 insertions(+), 236 deletions(-)
 delete mode 100644 client/webpack-dev-client/index.js
 delete mode 100644 client/webpack-dev-client/socket.js
 create mode 100644 client/webpack-hot-middleware-client.js

diff --git a/client/next-dev.js b/client/next-dev.js
index 823107bb..454365e3 100644
--- a/client/next-dev.js
+++ b/client/next-dev.js
@@ -1,5 +1,4 @@
 import 'react-hot-loader/patch'
-import './webpack-dev-client?http://localhost:3030'
 import * as next from './next'
 
 module.exports = next
diff --git a/client/webpack-dev-client/index.js b/client/webpack-dev-client/index.js
deleted file mode 100644
index 94c46564..00000000
--- a/client/webpack-dev-client/index.js
+++ /dev/null
@@ -1,167 +0,0 @@
-/* global __resourceQuery, next */
-
-// Based on 'webpack-dev-server/client'
-
-import url from 'url'
-import stripAnsi from 'strip-ansi'
-import socket from './socket'
-
-function getCurrentScriptSource () {
-  // `document.currentScript` is the most accurate way to find the current script,
-  // but is not supported in all browsers.
-  if (document.currentScript) {
-    return document.currentScript.getAttribute('src')
-  }
-  // Fall back to getting all scripts in the document.
-  const scriptElements = document.scripts || []
-  const currentScript = scriptElements[scriptElements.length - 1]
-  if (currentScript) {
-    return currentScript.getAttribute('src')
-  }
-  // Fail as there was no script to use.
-  throw new Error('[WDS] Failed to get current script source')
-}
-
-let urlParts
-if (typeof __resourceQuery === 'string' && __resourceQuery) {
-  // If this bundle is inlined, use the resource query to get the correct url.
-  urlParts = url.parse(__resourceQuery.substr(1))
-} else {
-  // Else, get the url from the <script> this file was called with.
-  let scriptHost = getCurrentScriptSource()
-  scriptHost = scriptHost.replace(/\/[^\/]+$/, '')
-  urlParts = url.parse(scriptHost || '/', false, true)
-}
-
-let hot = false
-let initial = true
-let currentHash = ''
-let logLevel = 'info'
-
-function log (level, msg) {
-  if (logLevel === 'info' && level === 'info') {
-    return console.log(msg)
-  }
-  if (['info', 'warning'].indexOf(logLevel) >= 0 && level === 'warning') {
-    return console.warn(msg)
-  }
-  if (['info', 'warning', 'error'].indexOf(logLevel) >= 0 && level === 'error') {
-    return console.error(msg)
-  }
-}
-
-const onSocketMsg = {
-  hot () {
-    hot = true
-    log('info', '[WDS] Hot Module Replacement enabled.')
-  },
-  invalid () {
-    log('info', '[WDS] App updated. Recompiling...')
-  },
-  hash (hash) {
-    currentHash = hash
-  },
-  'still-ok': () => {
-    log('info', '[WDS] Nothing changed.')
-  },
-  'log-level': (level) => {
-    logLevel = level
-  },
-  ok () {
-    if (initial) {
-      initial = false
-      return
-    }
-    reloadApp()
-  },
-  warnings (warnings) {
-    log('info', '[WDS] Warnings while compiling.')
-    for (let i = 0; i < warnings.length; i++) {
-      console.warn(stripAnsi(warnings[i]))
-    }
-    if (initial) {
-      initial = false
-      return
-    }
-    reloadApp()
-  },
-  errors (errors) {
-    log('info', '[WDS] Errors while compiling.')
-    for (let i = 0; i < errors.length; i++) {
-      console.error(stripAnsi(errors[i]))
-    }
-    if (initial) {
-      initial = false
-      return
-    }
-    reloadApp()
-  },
-  'proxy-error': (errors) => {
-    log('info', '[WDS] Proxy error.')
-    for (let i = 0; i < errors.length; i++) {
-      log('error', stripAnsi(errors[i]))
-    }
-    if (initial) {
-      initial = false
-      return
-    }
-  },
-  reload (route) {
-    if (route === '/_error') {
-      for (const r of Object.keys(next.router.components)) {
-        const { Component } = next.router.components[r]
-        if (Component.__route === '/_error-debug') {
-          // reload all '/_error-debug'
-          // which are expected to be errors of '/_error' routes
-          next.router.reload(r)
-        }
-      }
-      return
-    }
-
-    next.router.reload(route)
-  },
-  close () {
-    log('error', '[WDS] Disconnected!')
-  }
-}
-
-let hostname = urlParts.hostname
-let protocol = urlParts.protocol
-
-if (urlParts.hostname === '0.0.0.0') {
-  // why do we need this check?
-  // hostname n/a for file protocol (example, when using electron, ionic)
-  // see: https://github.com/webpack/webpack-dev-server/pull/384
-  if (window.location.hostname && !!~window.location.protocol.indexOf('http')) {
-    hostname = window.location.hostname
-  }
-}
-
-// `hostname` can be empty when the script path is relative. In that case, specifying
-// a protocol would result in an invalid URL.
-// When https is used in the app, secure websockets are always necessary
-// because the browser doesn't accept non-secure websockets.
-if (hostname && (window.location.protocol === 'https:' || urlParts.hostname === '0.0.0.0')) {
-  protocol = window.location.protocol
-}
-
-const socketUrl = url.format({
-  protocol,
-  auth: urlParts.auth,
-  hostname,
-  port: (urlParts.port === '0') ? window.location.port : urlParts.port,
-  pathname: urlParts.path == null || urlParts.path === '/' ? '/sockjs-node' : urlParts.path
-})
-
-socket(socketUrl, onSocketMsg)
-
-function reloadApp () {
-  if (hot) {
-    log('info', '[WDS] App hot update...')
-    window.postMessage('webpackHotUpdate' + currentHash, '*')
-  } else {
-    log('info', '[WDS] App updated. Reloading...')
-    window.location.reload()
-  }
-}
diff --git a/client/webpack-dev-client/socket.js b/client/webpack-dev-client/socket.js
deleted file mode 100644
index 9710f1a1..00000000
--- a/client/webpack-dev-client/socket.js
+++ /dev/null
@@ -1,39 +0,0 @@
-import SockJS from 'sockjs-client'
-
-let retries = 0
-let sock = null
-
-export default function socket (url, handlers) {
-  sock = new SockJS(url)
-
-  sock.onopen = () => {
-    retries = 0
-  }
-
-  sock.onclose = () => {
-    if (retries === 0) handlers.close()
-
-    // Try to reconnect.
-    sock = null
-
-    // After 10 retries stop trying, to prevent logspam.
-    if (retries <= 10) {
-      // Exponentially increase timeout to reconnect.
-      // Respectfully copied from the package `got`.
-      const retryInMs = 1000 * Math.pow(2, retries) + Math.random() * 100
-      retries += 1
-
-      setTimeout(() => {
-        socket(url, handlers)
-      }, retryInMs)
-    }
-  }
-
-  sock.onmessage = (e) => {
-    // This assumes that all data sent via the websocket is JSON.
-    const msg = JSON.parse(e.data)
-    if (handlers[msg.type]) {
-      handlers[msg.type](msg.data)
-    }
-  }
-}
diff --git a/client/webpack-hot-middleware-client.js b/client/webpack-hot-middleware-client.js
new file mode 100644
index 00000000..44e69666
--- /dev/null
+++ b/client/webpack-hot-middleware-client.js
@@ -0,0 +1,30 @@
+/* global next */
+import webpackHotMiddlewareClient from 'webpack-hot-middleware/client?overlay=false&reload=true'
+
+const handlers = {
+  reload (route) {
+    if (route === '/_error') {
+      for (const r of Object.keys(next.router.components)) {
+        const { Component } = next.router.components[r]
+        if (Component.__route === '/_error-debug') {
+          // reload all '/_error-debug'
+          // which are expected to be errors of '/_error' routes
+          next.router.reload(r)
+        }
+      }
+      return
+    }
+
+    next.router.reload(route)
+  }
+}
+
+webpackHotMiddlewareClient.subscribe((obj) => {
+  const fn = handlers[obj.action]
+  if (fn) {
+    const data = obj.data || []
+    fn(...data)
+  } else {
+    throw new Error('Unexpected action ' + obj.action)
+  }
+})
diff --git a/package.json b/package.json
index ae09ca71..4e4a6ea0 100644
--- a/package.json
+++ b/package.json
@@ -58,8 +58,8 @@
     "strip-ansi": "3.0.1",
     "url": "0.11.0",
     "webpack": "1.13.3",
-    "webpack-dev-server": "1.16.2",
-    "sockjs-client": "1.1.1",
+    "webpack-dev-middleware": "1.8.4",
+    "webpack-hot-middleware": "2.13.2",
     "write-file-webpack-plugin": "3.4.2"
   },
   "devDependencies": {
diff --git a/server/build/plugins/watch-pages-plugin.js b/server/build/plugins/watch-pages-plugin.js
index 2eb1af9e..f86d4d37 100644
--- a/server/build/plugins/watch-pages-plugin.js
+++ b/server/build/plugins/watch-pages-plugin.js
@@ -35,7 +35,7 @@ export default class WatchPagesPlugin {
 
         if (compiler.hasEntry(name)) return
 
-        const entries = ['webpack/hot/dev-server', f]
+        const entries = ['next/dist/client/webpack-hot-middleware-client', f]
         compiler.addEntry(entries, name)
       })
 
@@ -47,7 +47,7 @@ export default class WatchPagesPlugin {
 
         if (name === errorPageName) {
           compiler.addEntry([
-            'webpack/hot/dev-server',
+            'next/dist/client/webpack-hot-middleware-client',
             join(__dirname, '..', '..', '..', 'pages', '_error.js')
           ], name)
         }
diff --git a/server/build/webpack.js b/server/build/webpack.js
index 871cd8c6..0811102d 100644
--- a/server/build/webpack.js
+++ b/server/build/webpack.js
@@ -14,7 +14,7 @@ export default async function createCompiler (dir, { hotReload = false, dev = fa
   const pages = await glob('pages/**/*.js', { cwd: dir })
 
   const entry = {}
-  const defaultEntries = hotReload ? ['webpack/hot/dev-server'] : []
+  const defaultEntries = hotReload ? ['next/dist/client/webpack-hot-middleware-client'] : []
   for (const p of pages) {
     entry[join('bundles', p)] = defaultEntries.concat(['./' + p])
   }
@@ -56,7 +56,9 @@ export default async function createCompiler (dir, { hotReload = false, dev = fa
 
   if (hotReload) {
     plugins.push(
+      new webpack.optimize.OccurrenceOrderPlugin(),
       new webpack.HotModuleReplacementPlugin(),
+      new webpack.NoErrorsPlugin(),
       new DetachPlugin(),
       new DynamicEntryPlugin(),
       new UnlinkFilePlugin(),
@@ -144,7 +146,7 @@ export default async function createCompiler (dir, { hotReload = false, dev = fa
       path: join(dir, '.next'),
       filename: '[name]',
       libraryTarget: 'commonjs2',
-      publicPath: hotReload ? 'http://localhost:3030/' : null
+      publicPath: hotReload ? '/_webpack/' : null
     },
     externals: [
       'react',
diff --git a/server/hot-reloader.js b/server/hot-reloader.js
index 87227a1d..69dab246 100644
--- a/server/hot-reloader.js
+++ b/server/hot-reloader.js
@@ -1,5 +1,6 @@
 import { join, relative, sep } from 'path'
-import WebpackDevServer from 'webpack-dev-server'
+import webpackDevMiddleware from 'webpack-dev-middleware'
+import webpackHotMiddleware from 'webpack-hot-middleware'
 import webpack from './build/webpack'
 import read from './read'
 
@@ -7,7 +8,9 @@ export default class HotReloader {
   constructor (dir, dev = false) {
     this.dir = dir
     this.dev = dev
-    this.server = null
+    this.middlewares = []
+    this.webpackDevMiddleware = null
+    this.webpackHotMiddleware = null
     this.initialized = false
     this.stats = null
     this.compilationErrors = null
@@ -16,13 +19,23 @@ export default class HotReloader {
     this.prevFailedChunkNames = null
   }
 
-  async start () {
-    await this.prepareServer()
-    this.stats = await this.waitUntilValid()
-    await this.listen()
+  async run (req, res) {
+    for (const fn of this.middlewares) {
+      await new Promise((resolve, reject) => {
+        fn(req, res, (err) => {
+          if (err) reject(err)
+          resolve()
+        })
+      })
+    }
   }
 
-  async prepareServer () {
+  async start () {
+    await this.prepareMiddlewares()
+    this.stats = await this.waitUntilValid()
+  }
+
+  async prepareMiddlewares () {
     const compiler = await webpack(this.dir, { hotReload: true, dev: this.dev })
 
     compiler.plugin('after-emit', (compilation, callback) => {
@@ -79,11 +92,9 @@ export default class HotReloader {
       this.prevFailedChunkNames = failedChunkNames
     })
 
-    this.server = new WebpackDevServer(compiler, {
-      publicPath: '/',
-      hot: true,
+    this.webpackDevMiddleware = webpackDevMiddleware(compiler, {
+      publicPath: '/_webpack/',
       noInfo: true,
-      clientLogLevel: 'warning',
       stats: {
         assets: false,
         children: false,
@@ -101,20 +112,18 @@ export default class HotReloader {
         warnings: false
       }
     })
+
+    this.webpackHotMiddleware = webpackHotMiddleware(compiler, { log: false })
+
+    this.middlewares = [
+      this.webpackDevMiddleware,
+      this.webpackHotMiddleware
+    ]
   }
 
   waitUntilValid () {
     return new Promise((resolve) => {
-      this.server.middleware.waitUntilValid(resolve)
-    })
-  }
-
-  listen () {
-    return new Promise((resolve, reject) => {
-      this.server.listen(3030, (err) => {
-        if (err) return reject(err)
-        resolve()
-      })
+      this.webpackDevMiddleware.waitUntilValid(resolve)
     })
   }
 
@@ -141,8 +150,8 @@ export default class HotReloader {
     return this.compilationErrors
   }
 
-  send (type, data) {
-    this.server.sockWrite(this.server.sockets, type, data)
+  send (action, ...args) {
+    this.webpackHotMiddleware.publish({ action, data: args })
   }
 }
 
diff --git a/server/index.js b/server/index.js
index 378976b1..6a2fa760 100644
--- a/server/index.js
+++ b/server/index.js
@@ -60,6 +60,10 @@ export default class Server {
   }
 
   async run (req, res) {
+    if (this.hotReloader) {
+      await this.hotReloader.run(req, res)
+    }
+
     const fn = this.router.match(req, res)
     if (fn) {
       await fn()

From c7ba914f527ebcfe084cb0e36946b9dee00d25fa Mon Sep 17 00:00:00 2001
From: Naoyuki Kanezawa <naoyuki.kanezawa@gmail.com>
Date: Thu, 24 Nov 2016 23:03:16 +0900
Subject: [PATCH 06/18] Handle runtime errors (#268)

* display runtime errors by error-debug

* server: fix status

* render Error component on client error

* server: render runtime errors of error template

* server: handle errors of error template on render404

* server: add a comment

* server: refactor renderJSON

* recover from runtime errors

* _error: check if xhr exists

* _error: improve client error

* _error: improve error message
---
 README.md                               |   8 +-
 client/next.js                          |   9 +-
 client/webpack-hot-middleware-client.js |   7 ++
 lib/router.js                           |  44 ++++++--
 pages/_error-debug.js                   |  14 ++-
 pages/_error.js                         |  12 ++-
 server/hot-reloader.js                  |  14 +++
 server/index.js                         | 138 +++++++++++++-----------
 server/render.js                        |  12 ++-
 9 files changed, 172 insertions(+), 86 deletions(-)

diff --git a/README.md b/README.md
index d6295573..0767d269 100644
--- a/README.md
+++ b/README.md
@@ -188,13 +188,17 @@ import React from 'react'
 
 export default class Error extends React.Component {
   static getInitialProps ({ res, xhr }) {
-    const statusCode = res ? res.statusCode : xhr.status
+    const statusCode = res ? res.statusCode : (xhr ? xhr.status : null)
     return { statusCode }
   }
 
   render () {
     return (
-      <p>An error { this.props.statusCode } occurred</p>
+      <p>{
+        this.props.statusCode
+        ? `An error ${this.props.statusCode} occurred on server`
+        : 'An error occurred on client'
+      ]</p>
     )
   }
 }
diff --git a/client/next.js b/client/next.js
index 6c8429d0..7b224536 100644
--- a/client/next.js
+++ b/client/next.js
@@ -7,12 +7,17 @@ import App from '../lib/app'
 import evalScript from '../lib/eval-script'
 
 const {
-  __NEXT_DATA__: { component, props, ids, err }
+  __NEXT_DATA__: { component, errorComponent, props, ids, err }
 } = window
 
 const Component = evalScript(component).default
+const ErrorComponent = evalScript(errorComponent).default
 
-export const router = new Router(window.location.href, { Component, ctx: { err } })
+export const router = new Router(window.location.href, {
+  Component,
+  ErrorComponent,
+  ctx: { err }
+})
 
 const headManager = new HeadManager()
 const container = document.getElementById('__next')
diff --git a/client/webpack-hot-middleware-client.js b/client/webpack-hot-middleware-client.js
index 44e69666..9e51fe50 100644
--- a/client/webpack-hot-middleware-client.js
+++ b/client/webpack-hot-middleware-client.js
@@ -16,6 +16,13 @@ const handlers = {
     }
 
     next.router.reload(route)
+  },
+  change (route) {
+    const { Component } = next.router.components[route] || {}
+    if (Component && Component.__route === '/_error-debug') {
+      // reload to recover from runtime errors
+      next.router.reload(route)
+    }
   }
 }
 
diff --git a/lib/router.js b/lib/router.js
index 553c5c3c..a336b82f 100644
--- a/lib/router.js
+++ b/lib/router.js
@@ -3,15 +3,16 @@ import evalScript from './eval-script'
 import shallowEquals from './shallow-equals'
 
 export default class Router {
-  constructor (url, initialData) {
+  constructor (url, { Component, ErrorComponent, ctx } = {}) {
     const parsed = parse(url, true)
 
     // represents the current component key
     this.route = toRoute(parsed.pathname)
 
     // set up the component cache (by route keys)
-    this.components = { [this.route]: initialData }
+    this.components = { [this.route]: { Component, ctx } }
 
+    this.ErrorComponent = ErrorComponent
     this.pathname = parsed.pathname
     this.query = parsed.query
     this.subscriptions = new Set()
@@ -38,13 +39,19 @@ export default class Router {
       this.route = route
       this.set(getURL(), { ...data, props })
     })
-    .catch((err) => {
+    .catch(async (err) => {
       if (err.cancelled) return
 
-      // the only way we can appropriately handle
-      // this failure is deferring to the browser
-      // since the URL has already changed
-      window.location.reload()
+      const data = { Component: this.ErrorComponent, ctx: { err } }
+      const ctx = { ...data.ctx, pathname, query }
+      const props = await this.getInitialProps(data.Component, ctx)
+
+      this.route = route
+      this.set(getURL(), { ...data, props })
+      console.error(err)
+    })
+    .catch((err) => {
+      console.error(err)
     })
   }
 
@@ -67,16 +74,25 @@ export default class Router {
 
     let data
     let props
+    let _err
     try {
       data = await this.fetchComponent(route)
       const ctx = { ...data.ctx, pathname, query }
       props = await this.getInitialProps(data.Component, ctx)
     } catch (err) {
       if (err.cancelled) return false
-      throw err
+
+      data = { Component: this.ErrorComponent, ctx: { err } }
+      const ctx = { ...data.ctx, pathname, query }
+      props = await this.getInitialProps(data.Component, ctx)
+
+      _err = err
+      console.error(err)
     }
 
     this.notify({ ...data, props })
+
+    if (_err) throw _err
   }
 
   back () {
@@ -100,13 +116,20 @@ export default class Router {
 
     let data
     let props
+    let _err
     try {
       data = await this.fetchComponent(route)
       const ctx = { ...data.ctx, pathname, query }
       props = await this.getInitialProps(data.Component, ctx)
     } catch (err) {
       if (err.cancelled) return false
-      throw err
+
+      data = { Component: this.ErrorComponent, ctx: { err } }
+      const ctx = { ...data.ctx, pathname, query }
+      props = await this.getInitialProps(data.Component, ctx)
+
+      _err = err
+      console.error(err)
     }
 
     if (getURL() !== url) {
@@ -115,6 +138,9 @@ export default class Router {
 
     this.route = route
     this.set(url, { ...data, props })
+
+    if (_err) throw _err
+
     return true
   }
 
diff --git a/pages/_error-debug.js b/pages/_error-debug.js
index e55c6abd..8913db2c 100644
--- a/pages/_error-debug.js
+++ b/pages/_error-debug.js
@@ -5,12 +5,12 @@ import style from 'next/css'
 
 export default class ErrorDebug extends React.Component {
   static getInitialProps ({ err }) {
-    const { message, module } = err
-    return { message, path: module.rawRequest }
+    const { name, message, stack, module } = err
+    return { name, message, stack, path: module ? module.rawRequest : null }
   }
 
   render () {
-    const { message, path } = this.props
+    const { name, message, stack, path } = this.props
 
     return <div className={styles.errorDebug}>
       <Head>
@@ -21,8 +21,12 @@ export default class ErrorDebug extends React.Component {
           }
         `}} />
       </Head>
-      <div className={styles.heading}>Error in {path}</div>
-      <pre className={styles.message} dangerouslySetInnerHTML={{ __html: ansiHTML(encodeHtml(message)) }} />
+      {path ? <div className={styles.heading}>Error in {path}</div> : null}
+      {
+        name === 'ModuleBuildError'
+        ? <pre className={styles.message} dangerouslySetInnerHTML={{ __html: ansiHTML(encodeHtml(message)) }} />
+        : <pre className={styles.message}>{stack}</pre>
+      }
     </div>
   }
 }
diff --git a/pages/_error.js b/pages/_error.js
index df103f6b..192173aa 100644
--- a/pages/_error.js
+++ b/pages/_error.js
@@ -1,19 +1,21 @@
 import React from 'react'
-import style, { merge } from 'next/css'
+import style from 'next/css'
 
 export default class Error extends React.Component {
   static getInitialProps ({ res, xhr }) {
-    const statusCode = res ? res.statusCode : xhr.status
+    const statusCode = res ? res.statusCode : (xhr ? xhr.status : null)
     return { statusCode }
   }
 
   render () {
     const { statusCode } = this.props
-    const title = statusCode === 404 ? 'This page could not be found' : 'Internal Server Error'
+    const title = statusCode === 404
+      ? 'This page could not be found'
+      : (statusCode ? 'Internal Server Error' : 'An unexpected error has occurred')
 
-    return <div className={merge(styles.error, styles['error_' + statusCode])}>
+    return <div className={styles.error}>
       <div className={styles.text}>
-        <h1 className={styles.h1}>{statusCode}</h1>
+        {statusCode ? <h1 className={styles.h1}>{statusCode}</h1> : null}
         <div className={styles.desc}>
           <h2 className={styles.h2}>{title}.</h2>
         </div>
diff --git a/server/hot-reloader.js b/server/hot-reloader.js
index 69dab246..bab1b6fe 100644
--- a/server/hot-reloader.js
+++ b/server/hot-reloader.js
@@ -17,6 +17,7 @@ export default class HotReloader {
     this.prevAssets = null
     this.prevChunkNames = null
     this.prevFailedChunkNames = null
+    this.prevChunkHashes = null
   }
 
   async run (req, res) {
@@ -66,6 +67,8 @@ export default class HotReloader {
       .reduce((a, b) => a.concat(b), [])
       .map((c) => c.name))
 
+      const chunkHashes = new Map(compilation.chunks.map((c) => [c.name, c.hash]))
+
       if (this.initialized) {
         // detect chunks which have to be replaced with a new template
         // e.g, pages/index.js <-> pages/_error.js
@@ -83,6 +86,16 @@ export default class HotReloader {
           const route = toRoute(relative(rootDir, n))
           this.send('reload', route)
         }
+
+        for (const [n, hash] of chunkHashes) {
+          if (!this.prevChunkHashes.has(n)) continue
+          if (this.prevChunkHashes.get(n) === hash) continue
+
+          const route = toRoute(relative(rootDir, n))
+
+          // notify change to recover from runtime errors
+          this.send('change', route)
+        }
       }
 
       this.initialized = true
@@ -90,6 +103,7 @@ export default class HotReloader {
       this.compilationErrors = null
       this.prevChunkNames = chunkNames
       this.prevFailedChunkNames = failedChunkNames
+      this.prevChunkHashes = chunkHashes
     })
 
     this.webpackDevMiddleware = webpackDevMiddleware(compiler, {
diff --git a/server/index.js b/server/index.js
index 6a2fa760..7ebbaa74 100644
--- a/server/index.js
+++ b/server/index.js
@@ -18,7 +18,7 @@ export default class Server {
       this.run(req, res)
       .catch((err) => {
         console.error(err)
-        res.status(500)
+        res.statusCode = 500
         res.end('error')
       })
     })
@@ -73,96 +73,112 @@ export default class Server {
   }
 
   async render (req, res) {
-    const { dir, dev } = this
     const { pathname, query } = parse(req.url, true)
     const ctx = { req, res, pathname, query }
-    const opts = { dir, dev }
 
-    let html
+    const compilationErr = this.getCompilationError(req.url)
+    if (compilationErr) {
+      await this.doRender(res, 500, '/_error-debug', { ...ctx, err: compilationErr })
+      return
+    }
+
+    try {
+      await this.doRender(res, 200, req.url, ctx)
+    } catch (err) {
+      const compilationErr2 = this.getCompilationError('/_error')
+      if (compilationErr2) {
+        await this.doRender(res, 500, '/_error-debug', { ...ctx, err: compilationErr2 })
+        return
+      }
+
+      if (err.code !== 'ENOENT') {
+        console.error(err)
+        const url = this.dev ? '/_error-debug' : '/_error'
+        await this.doRender(res, 500, url, { ...ctx, err })
+        return
+      }
 
-    const err = this.getCompilationError(req.url)
-    if (err) {
-      res.statusCode = 500
-      html = await render('/_error-debug', { ...ctx, err }, opts)
-    } else {
       try {
-        html = await render(req.url, ctx, opts)
-      } catch (err) {
-        const _err = this.getCompilationError('/_error')
-        if (_err) {
-          res.statusCode = 500
-          html = await render('/_error-debug', { ...ctx, err: _err }, opts)
+        await this.doRender(res, 404, '/_error', { ...ctx, err })
+      } catch (err2) {
+        if (this.dev) {
+          await this.doRender(res, 500, '/_error-debug', { ...ctx, err: err2 })
         } else {
-          if (err.code === 'ENOENT') {
-            res.statusCode = 404
-          } else {
-            console.error(err)
-            res.statusCode = 500
-          }
-          html = await render('/_error', { ...ctx, err }, opts)
+          throw err2
         }
       }
     }
+  }
 
+  async doRender (res, statusCode, url, ctx) {
+    const { dir, dev } = this
+
+    // need to set statusCode before `render`
+    // since it can be used on getInitialProps
+    res.statusCode = statusCode
+
+    const html = await render(url, ctx, { dir, dev })
     sendHTML(res, html)
   }
 
   async renderJSON (req, res) {
-    const { dir } = this
-    const opts = { dir }
+    const compilationErr = this.getCompilationError(req.url)
+    if (compilationErr) {
+      await this.doRenderJSON(res, 500, '/_error-debug.json', compilationErr)
+      return
+    }
 
-    let json
-
-    const err = this.getCompilationError(req.url)
-    if (err) {
-      res.statusCode = 500
-      json = await renderJSON('/_error-debug.json', opts)
-      json = { ...json, err: errorToJSON(err) }
-    } else {
-      try {
-        json = await renderJSON(req.url, opts)
-      } catch (err) {
-        const _err = this.getCompilationError('/_error.json')
-        if (_err) {
-          res.statusCode = 500
-          json = await renderJSON('/_error-debug.json', opts)
-          json = { ...json, err: errorToJSON(_err) }
-        } else {
-          if (err.code === 'ENOENT') {
-            res.statusCode = 404
-          } else {
-            console.error(err)
-            res.statusCode = 500
-          }
-          json = await renderJSON('/_error.json', opts)
-        }
+    try {
+      await this.doRenderJSON(res, 200, req.url)
+    } catch (err) {
+      const compilationErr2 = this.getCompilationError('/_error.json')
+      if (compilationErr2) {
+        await this.doRenderJSON(res, 500, '/_error-debug.json', compilationErr2)
+        return
       }
+
+      if (err.code === 'ENOENT') {
+        await this.doRenderJSON(res, 404, '/_error.json')
+      } else {
+        console.error(err)
+        await this.doRenderJSON(res, 500, '/_error.json')
+      }
+    }
+  }
+
+  async doRenderJSON (res, statusCode, url, err) {
+    const { dir } = this
+    const json = await renderJSON(url, { dir })
+    if (err) {
+      json.err = errorToJSON(err)
     }
 
     const data = JSON.stringify(json)
     res.setHeader('Content-Type', 'application/json')
     res.setHeader('Content-Length', Buffer.byteLength(data))
+    res.statusCode = statusCode
     res.end(data)
   }
 
   async render404 (req, res) {
-    const { dir, dev } = this
     const { pathname, query } = parse(req.url, true)
     const ctx = { req, res, pathname, query }
-    const opts = { dir, dev }
 
-    let html
-
-    const err = this.getCompilationError('/_error')
-    if (err) {
-      res.statusCode = 500
-      html = await render('/_error-debug', { ...ctx, err }, opts)
-    } else {
-      res.statusCode = 404
-      html = await render('/_error', ctx, opts)
+    const compilationErr = this.getCompilationError('/_error')
+    if (compilationErr) {
+      await this.doRender(res, 500, '/_error-debug', { ...ctx, err: compilationErr })
+      return
     }
 
-    sendHTML(res, html)
+    try {
+      await this.doRender(res, 404, '/_error', ctx)
+    } catch (err) {
+      if (this.dev) {
+        await this.doRender(res, 500, '/_error-debug', { ...ctx, err })
+      } else {
+        throw err
+      }
+    }
   }
 
   serveStatic (req, res, path) {
diff --git a/server/render.js b/server/render.js
index 51fb324a..aca88638 100644
--- a/server/render.js
+++ b/server/render.js
@@ -20,8 +20,15 @@ export async function render (url, ctx = {}, {
   const mod = await requireModule(join(dir, '.next', 'dist', 'pages', path))
   const Component = mod.default || mod
 
-  const props = await (Component.getInitialProps ? Component.getInitialProps(ctx) : {})
-  const component = await read(join(dir, '.next', 'bundles', 'pages', path))
+  const [
+    props,
+    component,
+    errorComponent
+  ] = await Promise.all([
+    Component.getInitialProps ? Component.getInitialProps(ctx) : {},
+    read(join(dir, '.next', 'bundles', 'pages', path)),
+    read(join(dir, '.next', 'bundles', 'pages', dev ? '_error-debug' : '_error'))
+  ])
 
   const { html, css, ids } = renderStatic(() => {
     const app = createElement(App, {
@@ -42,6 +49,7 @@ export async function render (url, ctx = {}, {
     css,
     data: {
       component,
+      errorComponent,
       props,
       ids: ids,
       err: (ctx.err && dev) ? errorToJSON(ctx.err) : null

From fcd59adea1a5fe34f5a663d7d2cdb8807f0315d4 Mon Sep 17 00:00:00 2001
From: Arunoda Susiripala <arunoda.susiripala@gmail.com>
Date: Mon, 28 Nov 2016 05:45:56 +0530
Subject: [PATCH 07/18] Add support for webpack's CommonsChunkPlugin and remove
 next bundle (#301)

* Add example app which demonstrate the problem.

* Add the first working version.

* Fix lint issues.

* Add README.md

* Use /_next/main.js as the main file URI

* Add the support for loading the core next bundle.

* Optimize the output by removing Next modules from pages.

* Use the same package.json as master use.

* Change the example repo's README for simpler instructions.

* Change example projects package.json to support next build and start.

* Change main.js into commons.js.

* Add support for hot core reload and errors.

* Introduce require based on eval-script.

* Add error reporting support with hot reloading.

* Update README.md
---
 client/next-dev.js                            |  4 +--
 client/next.js                                | 35 ++++++++++++-------
 examples/shared-modules/README.md             | 13 +++++++
 examples/shared-modules/components/Counter.js | 19 ++++++++++
 examples/shared-modules/components/Header.js  | 20 +++++++++++
 examples/shared-modules/package.json          | 19 ++++++++++
 examples/shared-modules/pages/about.js        | 11 ++++++
 examples/shared-modules/pages/index.js        | 11 ++++++
 gulpfile.js                                   |  4 +--
 lib/document.js                               |  6 ++--
 lib/eval-script.js                            | 15 +++++---
 server/build/webpack.js                       |  4 +++
 server/index.js                               |  5 +++
 13 files changed, 143 insertions(+), 23 deletions(-)
 create mode 100644 examples/shared-modules/README.md
 create mode 100644 examples/shared-modules/components/Counter.js
 create mode 100644 examples/shared-modules/components/Header.js
 create mode 100644 examples/shared-modules/package.json
 create mode 100644 examples/shared-modules/pages/about.js
 create mode 100644 examples/shared-modules/pages/index.js

diff --git a/client/next-dev.js b/client/next-dev.js
index 454365e3..f46e8855 100644
--- a/client/next-dev.js
+++ b/client/next-dev.js
@@ -1,6 +1,6 @@
 import 'react-hot-loader/patch'
 import * as next from './next'
-
-module.exports = next
+import { requireModule } from '../lib/eval-script'
 
 window.next = next
+module.exports = requireModule
diff --git a/client/next.js b/client/next.js
index 7b224536..00333dd1 100644
--- a/client/next.js
+++ b/client/next.js
@@ -4,24 +4,33 @@ import HeadManager from './head-manager'
 import { rehydrate } from '../lib/css'
 import Router from '../lib/router'
 import App from '../lib/app'
-import evalScript from '../lib/eval-script'
+import evalScript, { requireModule } from '../lib/eval-script'
 
 const {
   __NEXT_DATA__: { component, errorComponent, props, ids, err }
 } = window
 
-const Component = evalScript(component).default
-const ErrorComponent = evalScript(errorComponent).default
+document.addEventListener('DOMContentLoaded', () => {
+  const Component = evalScript(component).default
+  const ErrorComponent = evalScript(errorComponent).default
 
-export const router = new Router(window.location.href, {
-  Component,
-  ErrorComponent,
-  ctx: { err }
+  const router = new Router(window.location.href, {
+    Component,
+    ErrorComponent,
+    ctx: { err }
+  })
+
+  // This it to support error handling in the dev time with hot code reload.
+  if (window.next) {
+    window.next.router = router
+  }
+
+  const headManager = new HeadManager()
+  const container = document.getElementById('__next')
+  const appProps = { Component, props, router, headManager }
+
+  rehydrate(ids)
+  render(createElement(App, appProps), container)
 })
 
-const headManager = new HeadManager()
-const container = document.getElementById('__next')
-const appProps = { Component, props, router, headManager }
-
-rehydrate(ids)
-render(createElement(App, appProps), container)
+module.exports = requireModule
diff --git a/examples/shared-modules/README.md b/examples/shared-modules/README.md
new file mode 100644
index 00000000..1e629fd9
--- /dev/null
+++ b/examples/shared-modules/README.md
@@ -0,0 +1,13 @@
+# Example app using shared modules
+
+This example features:
+
+* An app with two pages which has a common Counter component
+* That Counter component maintain the counter inside its module.
+
+## How to run it
+
+```sh
+npm install
+npm run dev
+```
diff --git a/examples/shared-modules/components/Counter.js b/examples/shared-modules/components/Counter.js
new file mode 100644
index 00000000..959d8ae9
--- /dev/null
+++ b/examples/shared-modules/components/Counter.js
@@ -0,0 +1,19 @@
+import React from 'react'
+
+let count = 0
+
+export default class Counter extends React.Component {
+  add () {
+    count += 1
+    this.forceUpdate()
+  }
+
+  render () {
+    return (
+      <div>
+        <p>Count is: {count}</p>
+        <button onClick={() => this.add()}>Add</button>
+      </div>
+    )
+  }
+}
diff --git a/examples/shared-modules/components/Header.js b/examples/shared-modules/components/Header.js
new file mode 100644
index 00000000..52c6b543
--- /dev/null
+++ b/examples/shared-modules/components/Header.js
@@ -0,0 +1,20 @@
+import React from 'react'
+import Link from 'next/link'
+
+const styles = {
+  a: {
+    marginRight: 10
+  }
+}
+
+export default () => (
+  <div>
+    <Link href='/'>
+      <a style={styles.a} >Home</a>
+    </Link>
+
+    <Link href='/about'>
+      <a style={styles.a} >About</a>
+    </Link>
+  </div>
+)
diff --git a/examples/shared-modules/package.json b/examples/shared-modules/package.json
new file mode 100644
index 00000000..aeb6e6b5
--- /dev/null
+++ b/examples/shared-modules/package.json
@@ -0,0 +1,19 @@
+{
+  "name": "shared-modules",
+  "version": "1.0.0",
+  "description": "This example features:",
+  "main": "index.js",
+  "scripts": {
+    "dev": "next",
+    "build": "next build",
+    "start": "next start"
+  },
+  "dependencies": {
+    "next": "*"
+  },
+  "author": "",
+  "license": "ISC",
+  "next": {
+    "cdn": false
+  }
+}
diff --git a/examples/shared-modules/pages/about.js b/examples/shared-modules/pages/about.js
new file mode 100644
index 00000000..f7122c7c
--- /dev/null
+++ b/examples/shared-modules/pages/about.js
@@ -0,0 +1,11 @@
+import React from 'react'
+import Header from '../components/Header'
+import Counter from '../components/Counter'
+
+export default () => (
+  <div>
+    <Header />
+    <p>This is the about page.</p>
+    <Counter />
+  </div>
+)
diff --git a/examples/shared-modules/pages/index.js b/examples/shared-modules/pages/index.js
new file mode 100644
index 00000000..d3dcba1d
--- /dev/null
+++ b/examples/shared-modules/pages/index.js
@@ -0,0 +1,11 @@
+import React from 'react'
+import Header from '../components/Header'
+import Counter from '../components/Counter'
+
+export default () => (
+  <div>
+    <Header />
+    <p>HOME PAGE is here!</p>
+    <Counter />
+  </div>
+)
diff --git a/gulpfile.js b/gulpfile.js
index 45a9f5b3..1332c828 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -100,7 +100,7 @@ gulp.task('build-dev-client', ['compile-lib', 'compile-client'], () => {
   .src('dist/client/next-dev.js')
   .pipe(webpack({
     quiet: true,
-    output: { filename: 'next-dev.bundle.js' },
+    output: { filename: 'next-dev.bundle.js', libraryTarget: 'var', library: 'require' },
     module: {
       loaders: [
         {
@@ -125,7 +125,7 @@ gulp.task('build-client', ['compile-lib', 'compile-client'], () => {
   .src('dist/client/next.js')
   .pipe(webpack({
     quiet: true,
-    output: { filename: 'next.bundle.js' },
+    output: { filename: 'next.bundle.js', libraryTarget: 'var', library: 'require' },
     plugins: [
       new webpack.webpack.DefinePlugin({
         'process.env': {
diff --git a/lib/document.js b/lib/document.js
index 9cef4a64..8dd5ec53 100644
--- a/lib/document.js
+++ b/lib/document.js
@@ -10,8 +10,11 @@ export default ({ head, css, html, data, dev, staticMarkup, cdn }) => {
     </head>
     <body>
       <div id='__next' dangerouslySetInnerHTML={{ __html: html }} />
-      {staticMarkup ? null : <script dangerouslySetInnerHTML={{ __html: '__NEXT_DATA__ = ' + htmlescape(data) }} />}
+      {staticMarkup ? null : <script dangerouslySetInnerHTML={{
+        __html: `__NEXT_DATA__ =${htmlescape(data)}; module={};`
+      }} />}
       {staticMarkup ? null : createClientScript({ dev, cdn })}
+      <script type='text/javascript' src='/_next/commons.js' />
     </body>
   </html>
 }
@@ -30,7 +33,6 @@ function createClientScript ({ dev, cdn }) {
       load('https://cdn.zeit.co/next.js/${pkg.version}/next.min.js', function (err) {
         if (err) load('/_next/next.bundle.js')
       })
-
       function load (src, fn) {
         fn = fn || function () {}
         var script = document.createElement('script')
diff --git a/lib/eval-script.js b/lib/eval-script.js
index 58b775f4..335384a6 100644
--- a/lib/eval-script.js
+++ b/lib/eval-script.js
@@ -14,6 +14,17 @@ const modules = new Map([
   ['next/head', Head]
 ])
 
+function require (moduleName) {
+  const name = moduleName
+  const m = modules.get(name)
+
+  if (m) return m
+
+  throw new Error(`Module "${moduleName}" is not exists in the bundle`)
+}
+
+export const requireModule = require
+
 /**
  * IMPORTANT: This module is compiled *without* `use strict`
  * so that when we `eval` a dependency below, we don't enforce
@@ -28,10 +39,6 @@ const modules = new Map([
 
 export default function evalScript (script) {
   const module = { exports: {} }
-  const require = function (path) { // eslint-disable-line no-unused-vars
-    return modules.get(path)
-  }
-  // don't use Function() here since it changes source locations
   eval(script) // eslint-disable-line no-eval
   return module.exports
 }
diff --git a/server/build/webpack.js b/server/build/webpack.js
index 0811102d..df8049c7 100644
--- a/server/build/webpack.js
+++ b/server/build/webpack.js
@@ -39,6 +39,10 @@ export default async function createCompiler (dir, { hotReload = false, dev = fa
       log: false,
       // required not to cache removed files
       useHashIndex: false
+    }),
+    new webpack.optimize.CommonsChunkPlugin({
+      name: 'commons',
+      filename: 'commons.js'
     })
   ]
 
diff --git a/server/index.js b/server/index.js
index 7ebbaa74..ff3ae803 100644
--- a/server/index.js
+++ b/server/index.js
@@ -40,6 +40,11 @@ export default class Server {
   }
 
   defineRoutes () {
+    this.router.get('/_next/commons.js', async (req, res, params) => {
+      const p = join(this.dir, '.next/commons.js')
+      await this.serveStatic(req, res, p)
+    })
+
     this.router.get('/_next/:path+', async (req, res, params) => {
       const p = join(__dirname, '..', 'client', ...(params.path || []))
       await this.serveStatic(req, res, p)

From 10b815b9c9a8b4855df326c3e8bc8e4a02364fae Mon Sep 17 00:00:00 2001
From: Jonas Windey <jonas.windey@gmail.com>
Date: Mon, 28 Nov 2016 12:46:42 +0100
Subject: [PATCH 08/18] Add react-require to avoid importing React  (#295)

* Add react-require

* Add babel-plugin-react-require
---
 package.json            | 1 +
 server/build/webpack.js | 1 +
 2 files changed, 2 insertions(+)

diff --git a/package.json b/package.json
index 4e4a6ea0..197f9ea3 100644
--- a/package.json
+++ b/package.json
@@ -33,6 +33,7 @@
     "babel-generator": "6.19.0",
     "babel-loader": "6.2.8",
     "babel-plugin-module-resolver": "2.3.0",
+    "babel-plugin-react-require": "^3.0.0",
     "babel-plugin-transform-async-to-generator": "6.16.0",
     "babel-plugin-transform-class-properties": "6.19.0",
     "babel-plugin-transform-object-rest-spread": "6.19.0",
diff --git a/server/build/webpack.js b/server/build/webpack.js
index df8049c7..f731d350 100644
--- a/server/build/webpack.js
+++ b/server/build/webpack.js
@@ -118,6 +118,7 @@ export default async function createCompiler (dir, { hotReload = false, dev = fa
     query: {
       presets: ['es2015', 'react'],
       plugins: [
+        require.resolve('babel-plugin-react-require'),
         require.resolve('babel-plugin-transform-async-to-generator'),
         require.resolve('babel-plugin-transform-object-rest-spread'),
         require.resolve('babel-plugin-transform-class-properties'),

From 7a66870af9734c2f319b5359bc22301f1034ecaa Mon Sep 17 00:00:00 2001
From: Ian Mitchell <ian.mitchel1@live.com>
Date: Mon, 28 Nov 2016 06:04:59 -0800
Subject: [PATCH 09/18] Add Polling for Bash on Windows (#302)

* Add Polling for Bash on Windows

Fixes #166

* Add Windows Bash Dependency
---
 package.json           |  1 +
 server/hot-reloader.js | 12 +++++++++++-
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 197f9ea3..794a3dff 100644
--- a/package.json
+++ b/package.json
@@ -46,6 +46,7 @@
     "glamor": "2.18.2",
     "glob-promise": "2.0.0",
     "htmlescape": "1.1.1",
+    "is-windows-bash": "1.0.1",
     "json-loader": "0.5.4",
     "loader-utils": "0.2.16",
     "minimist": "1.2.0",
diff --git a/server/hot-reloader.js b/server/hot-reloader.js
index bab1b6fe..9c13425f 100644
--- a/server/hot-reloader.js
+++ b/server/hot-reloader.js
@@ -1,6 +1,7 @@
 import { join, relative, sep } from 'path'
 import webpackDevMiddleware from 'webpack-dev-middleware'
 import webpackHotMiddleware from 'webpack-hot-middleware'
+import isWindowsBash from 'is-windows-bash'
 import webpack from './build/webpack'
 import read from './read'
 
@@ -106,6 +107,14 @@ export default class HotReloader {
       this.prevChunkHashes = chunkHashes
     })
 
+    const windowsSettings = isWindowsBash() ? {
+      lazy: false,
+      watchOptions: {
+        aggregateTimeout: 300,
+        poll: true
+      }
+    } : {}
+
     this.webpackDevMiddleware = webpackDevMiddleware(compiler, {
       publicPath: '/_webpack/',
       noInfo: true,
@@ -124,7 +133,8 @@ export default class HotReloader {
         timings: false,
         version: false,
         warnings: false
-      }
+      },
+      ...windowsSettings
     })
 
     this.webpackHotMiddleware = webpackHotMiddleware(compiler, { log: false })

From a13c6ccb1182af32923e587a0d86f2eacac0e022 Mon Sep 17 00:00:00 2001
From: Frederick Fogerty <frederick.fogerty@gmail.com>
Date: Fri, 2 Dec 2016 00:30:36 +1300
Subject: [PATCH 10/18] Allow the pages directory to be in node_modules (#318)

---
 server/build/webpack.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/server/build/webpack.js b/server/build/webpack.js
index f731d350..56aff0eb 100644
--- a/server/build/webpack.js
+++ b/server/build/webpack.js
@@ -113,7 +113,7 @@ export default async function createCompiler (dir, { hotReload = false, dev = fa
     loader: 'babel',
     include: [dir, nextPagesDir],
     exclude (str) {
-      return /node_modules/.test(str) && str.indexOf(nextPagesDir) !== 0
+      return /node_modules/.test(str) && str.indexOf(nextPagesDir) !== 0 && str.indexOf(dir) !== 0
     },
     query: {
       presets: ['es2015', 'react'],

From 94b1fb0d1041273fcee95c18db75bebb16c4590e Mon Sep 17 00:00:00 2001
From: Greenkeeper <support@greenkeeper.io>
Date: Thu, 1 Dec 2016 12:34:39 +0100
Subject: [PATCH 11/18] chore(package): update glamor to version 2.20.8 (#317)

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 794a3dff..af68888b 100644
--- a/package.json
+++ b/package.json
@@ -43,7 +43,7 @@
     "babel-runtime": "6.18.0",
     "cross-spawn": "5.0.1",
     "del": "2.2.2",
-    "glamor": "2.18.2",
+    "glamor": "2.20.8",
     "glob-promise": "2.0.0",
     "htmlescape": "1.1.1",
     "is-windows-bash": "1.0.1",

From 39c6536bccf2ff6d51f5ab91b3883df72400ba11 Mon Sep 17 00:00:00 2001
From: nkzawa <naoyuki.kanezawa@gmail.com>
Date: Thu, 1 Dec 2016 20:39:56 +0900
Subject: [PATCH 12/18] fix a test

---
 test/index.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/test/index.js b/test/index.js
index ba583ebe..c3bf9340 100644
--- a/test/index.js
+++ b/test/index.js
@@ -15,8 +15,8 @@ test(async t => {
 
 test(async t => {
   const html = await render('/css')
-  t.true(html.includes('.css-im3wl1'))
-  t.true(html.includes('<div class="css-im3wl1">This is red</div>'))
+  t.regex(html, /\.css-\w+/)
+  t.regex(html, /<div class="css-\w+">This is red<\/div>/)
 })
 
 test(async t => {

From 333708c751a52ed5e72302522a60dceadeea2e2e Mon Sep 17 00:00:00 2001
From: Greenkeeper <support@greenkeeper.io>
Date: Thu, 1 Dec 2016 12:40:38 +0100
Subject: [PATCH 13/18] chore(package): update babel-plugin-module-resolver to
 version 2.4.0 (#314)

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index af68888b..3ad322c5 100644
--- a/package.json
+++ b/package.json
@@ -32,7 +32,7 @@
     "babel-core": "6.18.2",
     "babel-generator": "6.19.0",
     "babel-loader": "6.2.8",
-    "babel-plugin-module-resolver": "2.3.0",
+    "babel-plugin-module-resolver": "2.4.0",
     "babel-plugin-react-require": "^3.0.0",
     "babel-plugin-transform-async-to-generator": "6.16.0",
     "babel-plugin-transform-class-properties": "6.19.0",

From fff12d14db1e9f23de1308e0fd7e7428b4a4c7c6 Mon Sep 17 00:00:00 2001
From: Greenkeeper <support@greenkeeper.io>
Date: Thu, 1 Dec 2016 12:41:10 +0100
Subject: [PATCH 14/18] chore(package): update is-windows-bash to version 1.0.2
 (#305)

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 3ad322c5..ce98ee40 100644
--- a/package.json
+++ b/package.json
@@ -46,7 +46,7 @@
     "glamor": "2.20.8",
     "glob-promise": "2.0.0",
     "htmlescape": "1.1.1",
-    "is-windows-bash": "1.0.1",
+    "is-windows-bash": "1.0.2",
     "json-loader": "0.5.4",
     "loader-utils": "0.2.16",
     "minimist": "1.2.0",

From c36e0d98fdfadc6965330b9fa7af401c060b5c1b Mon Sep 17 00:00:00 2001
From: Greenkeeper <support@greenkeeper.io>
Date: Thu, 1 Dec 2016 12:50:35 +0100
Subject: [PATCH 15/18] chore(package): update standard to version 8.6.0 (#292)

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index ce98ee40..2839185a 100644
--- a/package.json
+++ b/package.json
@@ -77,7 +77,7 @@
     "gulp-notify": "2.2.0",
     "husky": "0.11.9",
     "run-sequence": "1.2.2",
-    "standard": "8.5.0",
+    "standard": "8.6.0",
     "webpack-stream": "3.2.0"
   }
 }

From 214c885b90722708db6a3febbbb80f90c8750eb2 Mon Sep 17 00:00:00 2001
From: nkzawa <naoyuki.kanezawa@gmail.com>
Date: Thu, 1 Dec 2016 20:54:17 +0900
Subject: [PATCH 16/18] remove unnecessary escape character for lint

---
 server/build/webpack.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/server/build/webpack.js b/server/build/webpack.js
index 56aff0eb..0ae5e14b 100644
--- a/server/build/webpack.js
+++ b/server/build/webpack.js
@@ -72,7 +72,7 @@ export default async function createCompiler (dir, { hotReload = false, dev = fa
   }
 
   const babelRuntimePath = require.resolve('babel-runtime/package')
-  .replace(/[\\\/]package\.json$/, '')
+  .replace(/[\\/]package\.json$/, '')
 
   const loaders = [{
     test: /\.js$/,

From f9726a5d5981c50206ab70eb5976317952b92610 Mon Sep 17 00:00:00 2001
From: Greenkeeper <support@greenkeeper.io>
Date: Thu, 1 Dec 2016 12:58:50 +0100
Subject: [PATCH 17/18] chore(package): update dependencies (#289)

---
 package.json | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index 2839185a..e13150d0 100644
--- a/package.json
+++ b/package.json
@@ -51,10 +51,10 @@
     "loader-utils": "0.2.16",
     "minimist": "1.2.0",
     "mkdirp-then": "1.2.0",
-    "mz": "2.5.0",
+    "mz": "2.6.0",
     "path-match": "1.2.4",
-    "react": "15.4.0",
-    "react-dom": "15.4.0",
+    "react": "15.4.1",
+    "react-dom": "15.4.1",
     "react-hot-loader": "3.0.0-beta.6",
     "send": "0.14.1",
     "strip-ansi": "3.0.1",

From fc369fa2407f018edc2b3b4425acf6aced37f818 Mon Sep 17 00:00:00 2001
From: Naoyuki Kanezawa <naoyuki.kanezawa@gmail.com>
Date: Fri, 2 Dec 2016 07:46:49 +0900
Subject: [PATCH 18/18] webpack: emit json and apply json-loader after emitting
 files (#298)

---
 server/build/webpack.js | 29 ++++++++++++++---------------
 1 file changed, 14 insertions(+), 15 deletions(-)

diff --git a/server/build/webpack.js b/server/build/webpack.js
index 0ae5e14b..7a87be8b 100644
--- a/server/build/webpack.js
+++ b/server/build/webpack.js
@@ -74,18 +74,7 @@ export default async function createCompiler (dir, { hotReload = false, dev = fa
   const babelRuntimePath = require.resolve('babel-runtime/package')
   .replace(/[\\/]package\.json$/, '')
 
-  const loaders = [{
-    test: /\.js$/,
-    loader: 'emit-file-loader',
-    include: [dir, nextPagesDir],
-    exclude (str) {
-      return /node_modules/.test(str) && str.indexOf(nextPagesDir) !== 0
-    },
-    query: {
-      name: 'dist/[path][name].[ext]'
-    }
-  }]
-  .concat(hotReload ? [{
+  const loaders = (hotReload ? [{
     test: /\.js$/,
     loader: 'hot-self-accept-loader',
     include: [
@@ -94,6 +83,19 @@ export default async function createCompiler (dir, { hotReload = false, dev = fa
     ]
   }] : [])
   .concat([{
+    test: /\.json$/,
+    loader: 'json-loader'
+  }, {
+    test: /\.(js|json)$/,
+    loader: 'emit-file-loader',
+    include: [dir, nextPagesDir],
+    exclude (str) {
+      return /node_modules/.test(str) && str.indexOf(nextPagesDir) !== 0
+    },
+    query: {
+      name: 'dist/[path][name].[ext]'
+    }
+  }, {
     loader: 'babel',
     include: nextPagesDir,
     query: {
@@ -180,9 +182,6 @@ export default async function createCompiler (dir, { hotReload = false, dev = fa
     },
     plugins,
     module: {
-      preLoaders: [
-        { test: /\.json$/, loader: 'json-loader' }
-      ],
       loaders
     },
     customInterpolateName: function (url, name, opts) {