From 180e8779e7c6aaad35ba01c9a878528168aced99 Mon Sep 17 00:00:00 2001 From: Thomas Charlat Date: Tue, 3 May 2016 18:06:59 +0200 Subject: [PATCH 1/4] updated babel to v6 --- .babelrc | 6 ++++++ package.json | 11 +++++++---- 2 files changed, 13 insertions(+), 4 deletions(-) create mode 100644 .babelrc 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/package.json b/package.json index 8c36b44..fb0b193 100644 --- a/package.json +++ b/package.json @@ -4,9 +4,6 @@ "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", @@ -17,5 +14,11 @@ "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" + } } From b289a9d1bba407df5031e5c30dfdcd749754205d Mon Sep 17 00:00:00 2001 From: Thomas Charlat Date: Tue, 3 May 2016 18:08:39 +0200 Subject: [PATCH 2/4] export default shall be accessed with require('...').default --- modules/routes/RootRoute.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) 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: { From ee4d82d0049a490b909a75fe87b440d644af6cb0 Mon Sep 17 00:00:00 2001 From: Thomas Charlat Date: Tue, 3 May 2016 18:13:55 +0200 Subject: [PATCH 3/4] updated react-router to v2 --- modules/client.js | 5 ++--- package.json | 3 +-- 2 files changed, 3 insertions(+), 5 deletions(-) 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/package.json b/package.json index fb0b193..7a3ecff 100644 --- a/package.json +++ b/package.json @@ -4,10 +4,9 @@ "description": "", "main": "client.js", "dependencies": { - "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": { From 9accfc06b810f506e9c6c7846e366fc395470867 Mon Sep 17 00:00:00 2001 From: Thomas Charlat Date: Tue, 3 May 2016 18:16:44 +0200 Subject: [PATCH 4/4] fixes a server.js import deprecation --- README.md | 2 +- modules/server.js | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) 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/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) }