diff --git a/README.md b/README.md index aa5c60b4b..05fd384ca 100644 --- a/README.md +++ b/README.md @@ -106,7 +106,7 @@ We also spit out the `redux` state into a global `window.__data` variable in the #### Server-side Data Fetching -The [redux-async-connect](https://www.npmjs.com/package/redux-async-connect) package exposes an API to return promises that need to be fulfilled before a route is rendered. It exposes a `` container, which wraps our render tree on both [server](https://github.com/erikras/react-redux-universal-hot-example/blob/master/src/server.js) and [client](https://github.com/erikras/react-redux-universal-hot-example/blob/master/src/client.js). More documentation is available on the [redux-async-connect](https://www.npmjs.com/package/redux-async-connect) page. +The [redux-connect](https://www.npmjs.com/package/redux-connect) package exposes an API to return promises that need to be fulfilled before a route is rendered. It exposes a `` container, which wraps our render tree on both [server](https://github.com/erikras/react-redux-universal-hot-example/blob/master/src/server.js) and [client](https://github.com/erikras/react-redux-universal-hot-example/blob/master/src/client.js). More documentation is available on the [redux-connect](https://www.npmjs.com/package/redux-connect) page. #### Client Side diff --git a/bin/server.js b/bin/server.js index d4792622e..6eb0b7b75 100644 --- a/bin/server.js +++ b/bin/server.js @@ -22,7 +22,6 @@ if (__DEVELOPMENT__) { // https://github.com/halt-hammerzeit/webpack-isomorphic-tools var WebpackIsomorphicTools = require('webpack-isomorphic-tools'); global.webpackIsomorphicTools = new WebpackIsomorphicTools(require('../webpack/webpack-isomorphic-tools')) - .development(__DEVELOPMENT__) .server(rootDir, function() { require('../src/server'); }); diff --git a/package.json b/package.json index f3fb6791c..a73bcf0d7 100644 --- a/package.json +++ b/package.json @@ -90,103 +90,104 @@ } }, "dependencies": { - "babel-core": "^6.5.2", - "babel-loader": "^6.2.1", - "babel-plugin-add-module-exports": "^0.1.2", + "babel-core": "^6.13.2", + "babel-loader": "^6.2.5", + "babel-plugin-add-module-exports": "^0.2.1", "babel-plugin-transform-decorators-legacy": "^1.3.4", "babel-plugin-transform-react-display-name": "^6.3.13", - "babel-plugin-transform-runtime": "^6.3.13", + "babel-plugin-transform-runtime": "^6.12.0", "babel-polyfill": "^6.3.14", "babel-preset-es2015": "^6.3.13", "babel-preset-react": "^6.3.13", "babel-preset-stage-0": "^6.3.13", "babel-register": "^6.3.13", - "babel-runtime": "^6.3.19", + "babel-runtime": "^6.11.6", "body-parser": "^1.14.1", "compression": "^1.6.0", "express": "^4.13.3", "express-session": "^1.12.1", - "file-loader": "^0.8.5", + "file-loader": "^0.9.0", "hoist-non-react-statics": "^1.0.3", "http-proxy": "^1.12.0", + "imports-loader": "^0.6.5", "invariant": "^2.2.0", "less": "^2.5.3", "less-loader": "^2.2.1", "lru-memoize": "^1.0.0", "map-props": "^1.0.0", "multireducer": "^2.0.0", - "piping": "^0.3.0", - "pretty-error": "^1.2.0", - "react": "^0.14.2", - "react-bootstrap": "^0.28.1", - "react-dom": "^0.14.1", - "react-helmet": "^2.2.0", + "piping": "^1.0.0-rc.4", + "pretty-error": "^2.0.0", + "react": "^15.3.2", + "react-bootstrap": "^0.30.1", + "react-dom": "^15.3.2", + "react-helmet": "^3.1.0", "react-inline-css": "^2.0.0", - "react-redux": "^4.0.0", - "react-router": "2.0.0", - "react-router-bootstrap": "^0.20.1", - "react-router-redux": "^4.0.0", + "react-redux": "^4.4.5", + "react-router": "^2.8.1", + "react-router-bootstrap": "^0.23.1", + "react-router-scroll": "^0.3.2", + "react-router-redux": "^4.0.6", "redux": "^3.0.4", - "redux-async-connect": "^1.0.0-rc2", - "redux-form": "^3.0.12", - "scroll-behavior": "^0.3.2", + "redux-connect": "^3.0.0", + "redux-form": "^5.2.5", "serialize-javascript": "^1.1.2", "serve-favicon": "^2.3.0", "socket.io": "^1.3.7", "socket.io-client": "^1.3.7", - "superagent": "^1.4.0", + "superagent": "^2.0.0", "url-loader": "^0.5.7", - "warning": "^2.1.0", + "warning": "^3.0.0", "webpack-isomorphic-tools": "^2.2.18" }, "devDependencies": { "autoprefixer-loader": "^3.1.0", - "babel-eslint": "^5.0.0-beta6", + "babel-eslint": "^6.1.2", "babel-plugin-react-transform": "^2.0.0", "babel-plugin-typecheck": "^3.6.0", - "better-npm-run": "0.0.8", - "bootstrap-sass": "^3.3.5", - "bootstrap-sass-loader": "^1.0.9", + "better-npm-run": "0.0.9", + "bootstrap-sass": "^3.3.7", + "bootstrap-sass-loader": "^1.0.10", "chai": "^3.3.0", "clean-webpack-plugin": "^0.1.6", - "concurrently": "^0.1.1", + "concurrently": "^2.1.0", "css-loader": "^0.23.1", "eslint": "1.10.3", "eslint-config-airbnb": "0.1.0", "eslint-loader": "^1.0.0", "eslint-plugin-import": "^0.8.0", "eslint-plugin-react": "^3.5.0", - "extract-text-webpack-plugin": "^0.9.1", + "extract-text-webpack-plugin": "^1.0.1", "font-awesome": "^4.4.0", - "font-awesome-webpack": "0.0.4", + "font-awesome-webpack": "^0.0.4", "json-loader": "^0.5.4", - "karma": "^0.13.10", - "karma-cli": "^0.1.1", - "karma-mocha": "^0.2.0", - "karma-mocha-reporter": "^1.1.1", - "karma-phantomjs-launcher": "^0.2.1", - "karma-sourcemap-loader": "^0.3.5", + "karma": "^1.1.2", + "karma-cli": "^1.0.1", + "karma-mocha": "^1.1.1", + "karma-mocha-reporter": "^2.0.4", + "karma-phantomjs-launcher": "^1.0.1", + "karma-sourcemap-loader": "^0.3.7", "karma-webpack": "^1.7.0", - "mocha": "^2.3.3", - "node-sass": "^3.4.2", - "phantomjs": "^1.9.18", - "phantomjs-polyfill": "0.0.1", - "react-a11y": "^0.2.6", - "react-addons-test-utils": "^0.14.0", + "mocha": "^3.0.2", + "node-sass": "^3.8.0", + "phantomjs": "^2.1.7", + "phantomjs-polyfill": "^0.0.2", + "react-a11y": "^0.3.3", + "react-addons-test-utils": "^15.3.2", "react-transform-catch-errors": "^1.0.0", "react-transform-hmr": "^1.0.1", "redbox-react": "^1.1.1", "redux-devtools": "^3.0.0-beta-3", "redux-devtools-dock-monitor": "^1.0.0-beta-3", "redux-devtools-log-monitor": "^1.0.0-beta-3", - "sass-loader": "^3.1.2", + "sass-loader": "^4.0.0", "sinon": "^1.17.2", "strip-loader": "^0.1.0", "style-loader": "^0.13.0", - "timekeeper": "0.0.5", - "webpack": "^1.12.9", - "webpack-dev-middleware": "^1.4.0", - "webpack-hot-middleware": "^2.5.0" + "timekeeper": "^0.1.1", + "webpack": "^1.13.1", + "webpack-dev-middleware": "^1.8.4", + "webpack-hot-middleware": "^2.13.0" }, "engines": { "node": "5.6.0" diff --git a/src/client.js b/src/client.js index c2a99a7cd..fc9f5ea27 100644 --- a/src/client.js +++ b/src/client.js @@ -8,18 +8,17 @@ import createStore from './redux/create'; import ApiClient from './helpers/ApiClient'; import io from 'socket.io-client'; import {Provider} from 'react-redux'; -import { Router, browserHistory } from 'react-router'; +import { Router, browserHistory, applyRouterMiddleware } from 'react-router'; import { syncHistoryWithStore } from 'react-router-redux'; -import { ReduxAsyncConnect } from 'redux-async-connect'; -import useScroll from 'scroll-behavior/lib/useStandardScroll'; +import { ReduxAsyncConnect } from 'redux-connect'; +import { useScroll } from 'react-router-scroll'; import getRoutes from './routes'; const client = new ApiClient(); -const _browserHistory = useScroll(() => browserHistory)(); const dest = document.getElementById('content'); -const store = createStore(_browserHistory, client, window.__data); -const history = syncHistoryWithStore(_browserHistory, store); +const store = createStore(browserHistory, client, window.__data); +const history = syncHistoryWithStore(browserHistory, store); function initSocket() { const socket = io('', {path: '/ws'}); @@ -38,7 +37,7 @@ global.socket = initSocket(); const component = ( - !item.deferred} /> + !item.deferred} render={applyRouterMiddleware(useScroll())}/> } history={history}> {getRoutes(store)} diff --git a/src/containers/App/App.js b/src/containers/App/App.js index 5623f2c23..65bb04b14 100644 --- a/src/containers/App/App.js +++ b/src/containers/App/App.js @@ -11,7 +11,7 @@ import { isLoaded as isAuthLoaded, load as loadAuth, logout } from 'redux/module import { InfoBar } from 'components'; import { push } from 'react-router-redux'; import config from '../../config'; -import { asyncConnect } from 'redux-async-connect'; +import { asyncConnect } from 'redux-connect'; @asyncConnect([{ promise: ({store: {dispatch, getState}}) => { @@ -24,7 +24,7 @@ import { asyncConnect } from 'redux-async-connect'; promises.push(dispatch(loadAuth())); } - return Promise.all(promises); + return __CLIENT__ ? null : Promise.all(promises); } }]) @connect( @@ -75,29 +75,29 @@ export default class App extends Component { - +