diff --git a/.babelrc b/.babelrc
new file mode 100644
index 0000000..dd477ca
--- /dev/null
+++ b/.babelrc
@@ -0,0 +1,6 @@
+{
+ "presets": [
+ "react",
+ "es2015"
+ ]
+}
\ No newline at end of file
diff --git a/README.md b/README.md
index 5910d8f..705c2a0 100644
--- a/README.md
+++ b/README.md
@@ -20,7 +20,7 @@ open http://localhost:5000
1. Webpack's `require.ensure` defines code splitting points in the app.
2. We polyfill `require.ensure` for node to just do a normal `require`.
3. The server renders the app with `match` and the stateless
- ``.
+ ``.
4. When the client JavaScript loads, we use `match` to trigger the split
code to load before rendering. If we didn't do that, then the first
render would be `null` and not reuse the server rendered markup.
diff --git a/modules/client.js b/modules/client.js
index 7c66ef5..6e97a25 100644
--- a/modules/client.js
+++ b/modules/client.js
@@ -1,7 +1,6 @@
import React from 'react'
-import { match, Router } from 'react-router'
+import { match, Router, browserHistory } from 'react-router'
import { render } from 'react-dom'
-import { createHistory } from 'history'
import routes from './routes/RootRoute'
const { pathname, search, hash } = window.location
@@ -11,7 +10,7 @@ const location = `${pathname}${search}${hash}`
// loading route/component code for the initial location
match({ routes, location }, () => {
render(
- ,
+ ,
document.getElementById('app')
)
})
diff --git a/modules/routes/RootRoute.js b/modules/routes/RootRoute.js
index 136bc44..6475baa 100644
--- a/modules/routes/RootRoute.js
+++ b/modules/routes/RootRoute.js
@@ -9,7 +9,7 @@ export default {
component: App,
getChildRoutes(location, cb) {
require.ensure([], (require) => {
- cb(null, [ require('./AboutRoute') ])
+ cb(null, [ require('./AboutRoute').default ])
})
},
indexRoute: {
diff --git a/modules/server.js b/modules/server.js
index 88050ec..5636862 100644
--- a/modules/server.js
+++ b/modules/server.js
@@ -1,7 +1,7 @@
import http from 'http'
import React from 'react'
import { renderToString } from 'react-dom/server'
-import { match, RoutingContext } from 'react-router'
+import { match, RouterContext } from 'react-router'
import fs from 'fs'
import { createPage, write, writeError, writeNotFound, redirect } from './utils/server-utils'
import routes from './routes/RootRoute'
@@ -9,7 +9,7 @@ import routes from './routes/RootRoute'
const PORT = process.env.PORT || 5000
function renderApp(props, res) {
- const markup = renderToString()
+ const markup = renderToString()
const html = createPage(markup)
write(html, 'text/html', res)
}
diff --git a/package.json b/package.json
index 8c36b44..7a3ecff 100644
--- a/package.json
+++ b/package.json
@@ -4,18 +4,20 @@
"description": "",
"main": "client.js",
"dependencies": {
- "babel": "^5.8.34",
- "babel-core": "^5.8.34",
- "babel-loader": "^5.4.0",
- "history": "^1.13.1",
"react": "^0.14.2",
"react-dom": "^0.14.2",
- "react-router": "^1.0.0",
+ "react-router": "^2.4.0",
"webpack": "^1.12.6"
},
"scripts": {
"start": "NODE_ENV=production webpack --progress && babel-node modules/server.js"
},
"author": "Ryan Florence",
- "license": "ISC"
+ "license": "ISC",
+ "devDependencies": {
+ "babel-cli": "^6.8.0",
+ "babel-loader": "^6.2.4",
+ "babel-preset-es2015": "^6.6.0",
+ "babel-preset-react": "^6.5.0"
+ }
}