also handle history fallback

yyx990803 · yyx990803 · commit febca13f0870 · 2016-01-20T15:54:08.000-05:00
diff --git a/README.md b/README.md
@@ -52,7 +52,7 @@ You will likely need to do some tuning to suit your own needs:
 
 - Working with an existing backend server:
 
-  - The dev server is simply an [Express](http://expressjs.com/) server with [webpack-dev-middleware](https://github.com/webpack/webpack-dev-middleware) and [webpack-hot-middleware](https://github.com/glenjamin/webpack-hot-middleware) pre-configured. You can add your own routing rules to `build/dev-server.js` to proxy certain requests to an existing backend server. Or, if you are using Express yourself, you can simply copy the middleware configuration.
+  - The dev server is simply an [Express](http://expressjs.com/) server with [webpack-dev-middleware](https://github.com/webpack/webpack-dev-middleware) and [webpack-hot-middleware](https://github.com/glenjamin/webpack-hot-middleware) pre-configured. You can add your own routing rules to `build/dev-server.js` to proxy certain requests to an existing backend server. Or, if you are using Express yourself, you can simply copy the middleware configuration, but **make sure to add them only in development mode!**
 
 - For unit testing:
 
diff --git a/template/build/dev-server.js b/template/build/dev-server.js
@@ -6,17 +6,19 @@ var config = require('./webpack.dev.conf')
 var app = express()
 var compiler = webpack(config)
 
+// handle fallback for HTML5 history API
+app.use(require('connect-history-api-fallback')())
+
+// serve webpack bundle output
 app.use(require('webpack-dev-middleware')(compiler, {
   noInfo: true,
   publicPath: config.output.publicPath
 }))
 
+// enable hot-reload and state-preserving
+// compilation error display
 app.use(require('webpack-hot-middleware')(compiler))
 
-app.get('*', function(req, res) {
-  res.sendFile(path.join(__dirname, 'index.html'))
-})
-
 app.listen(8080, 'localhost', function(err) {
   if (err) {
     console.log(err)
diff --git a/template/package.json b/template/package.json
@@ -20,6 +20,7 @@
     "babel-preset-es2015": "^6.0.0",
     "babel-preset-stage-2": "^6.0.0",
     "babel-runtime": "^5.8.0",
+    "connect-history-api-fallback": "^1.1.0",
     "css-loader": "^0.23.0",
     "eslint": "^1.10.3",
     "eslint-friendly-formatter": "^1.2.2",
