react-router-dom, is there a `getComponent` method for code splitting?

Question

I try to figure out how code splitting work with webpack2.x and react-router-dom.

"react-router-dom": "^4.0.0"

But I read the doc and did not find a way to use like this:

getComponent still work or not?

I find the react-router-dom doc just give you some example, no explain.

I saw react-router is v4.0.0-beta.8, Maybe I should use react-router-dom later?

module.exports = {
    path: 'home',
    getComponent(nextState, cb) {
        import('./main').then(component => {
            cb(null, component);
        }).catch(err => {
            console.log('Failed to load "home" component', err);
        });
    }
};

Answer 1

It looks like .getComponent() is no longer available. I think react-router hands off this responsibility to the developer to create his own async components. There is a great guide in the react-router-dom docs about handling code splitting using webpack2 and bundle-loader: https://github.com/ReactTraining/react-router/blob/master/packages/react-router-dom/docs/guides/code-splitting.md

And here is awesome quick code splitting example with React Router v4: https://gist.github.com/acdlite/a68433004f9d6b4cbc83b5cc3990c194

Hope that helps!