电子-React.createElement：类型无效错误

Question

I have just created a React application built on Electron and am trying to implement react-router . After much research and a couple hours of headache I am unable to correct this error the Electron Chrome console is presenting me with:

bundle.js:1426 Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Without react-router I am able to render components just like any other React application. Here is my code:

index.js

import React, { Component } from 'react';
import { render } from 'react-dom';
import { Router, Route, IndexRoute } from 'react-router';
import createHashHistory from 'history/createHashHistory';

import App from './containers/App';
import Login from './containers/Login';

const routes = (
  <Route path="/" component={App}>
    <IndexRoute component={Login} />
  </Route>
);

const MOUNT_NODE = document.getElementById('app');

render(
  <Router history={createHashHistory()} routes={routes} />,
  MOUNT_NODE
);

containers/App.js

import React, { Component, PropTypes } from 'react';

export default class AppContainer extends Component {
  constructor(props) {
    super(props);
    this.props.children = PropTypes.element.isRequired;
  }

  render() {
    return (
      <div>
        {this.props.children}
      </div>
    );
  }
}

containers/Login.js

import React, { Component } from 'react';
import Login from '../components/Login';

export default class LoginContainer extends Component {
  render() {
    return (
      <Login />
    );
  }
}

components/Login.js

import React, { Component } from 'react';

export default class Login extends Component {
  render() {
    return (
      <div>
        <h1>Login Component</h1>
      </div>
    );
  }
}

Any ideas on how to remove the quoted error? Thanks in advance.

Answer 1

What version of React Router are you using? Have you tried to import from react-router-dom instead of react-router?

import { Router, Route, IndexRoute } from 'react-router-dom';