Reactjs React路由器异步路由和网页包

我试图使用React路由器异步API来实现一些代码拆分

我目前有一个主路由文件和一个子例程：

// routes/index.js
export const createRoutes = (store) => ({
  path: '/',
  component: AppView,
  indexRoute: {
    onEnter: (nextState, transition) => {
      transition('/login')
    },
  },
  childRoutes: [
    LoginRoute(store),
  ]
})

然后我的登录路径如下所示：

//routes/Login/index.js
export default (store) => ({
  path: 'login',
  /*  Async getComponent is only invoked when route matches   */
  getComponent (nextState, cb) {
    /*  Webpack - use 'require.ensure' to create a split point
        and embed an async module loader (jsonp) when bundling   */
    require.ensure([], (require) => {
      /*  Webpack - use require callback to define
          dependencies for bundling   */
      const requireUnauthentication = require('containers/UnauthenticatedComponent').default;
      const LoginModalContainer = require('components/Login/LoginModalContainer').default;

      /*  Return getComponent   */
      cb(null, requireUnauthentication(LoginModalContainer))

    /* Webpack named bundle   */
  }, 'login')
  },
  indexRoute: {
    getComponent(nextState, cb){
      require.ensure([], (require) => {
        const LoginStart = require('components/Login/LoginStart').default;
        cb(null, LoginStart);
      }, 'login')
    }
  },
  getChildRoutes: (location, cb) => {
    require.ensure([], (require) => {
      const routes = [
        { path: 'login-start', component: require('components/Login/LoginStart').default },
        { path: 'login-prompt', component: require('containers/LoginContainer').default },
        { path: 'phone-number', component: require('components/Register/PhonenumberSet').default }
      ];
      cb(null, routes);
    }, 'login');
  }
})

问题是，当直接导航到/登录时，我遇到错误：

DOMLazyTree.js:62未捕获类型错误：无法读取null的属性“replaceChild”

ReactDOMComponentTree.js:105未捕获类型错误：无法读取null的属性“\uu reactInternalInstance$nva6m7qemb9ackp2ti2ro1or”

我认为这与异步路由配置有关，因为只要我更改了某些内容并开始热重新加载，所有内容都可以正常加载