1.0.0@beta1: Cannot read property '_currentElement' of null

[bwhitty]

Using the latest react-router available on Bower (in the browser) / NPM (in the build process), I am doing the following (built using browserify using babelify using the latest babel-core@5.5.8):

// Import the app
import App from "./components/App";
import {Router, Route, Link} from "react-router";
import HashHistory from 'react-router/lib/HashHistory';
React.render(
    <Router history={HashHistory}>
        <Route path="channels/web_site/website_control_manager.php/channel/:channelId" component={App} />
    </Router>,
    document.getElementById("website-controls-container")
);

where components/App.js is:

export default React.createClass({
    render() {
        return (
            <div>
                {this.props.children}
            </div>
        );
    }
});

I get the following error: Uncaught TypeError: Cannot read property '_currentElement' of null which dies in React in ReactCompositeComponentMixin._updateRenderedComponent at var prevRenderedElement = prevComponentInstance._currentElement;.

One thing of note is that I am using the above import statements to import react-router, which then imports react as its own dependency. This means that Babel/Browserify are pulling those dependencies into the bundle, but I'm Bower to install react-router and react for use in the browser (I could not figure out how to use the libraries as pulled into the bundle by Babel/Browserify)... could that be the possible culprit? And if so what is the Right Way to do this kind of thing (using ES6 imports, but then running it in the browser).

Thank you for any assistance.

[ryanflorence]

There's a lot going on there with bower/npm/browserify.

You need to not use bower, or not use browserify, and then we can help out some more.

I'm closing the issue because we're using the router in different apps and its working fine, but if you can work out your build and you still have issues, we're happy to help.

[nhazar]

@bwhitty did you mange to find what was causing the issue?

[bwhitty]

The gist is to use a bundler (Browserify / Webpack), or don't use a bundler, but don't mix these things with Bower.

[CarlosMela]

Hi, I am upgrading the router from v0.13.3 to v1.0.0-rc1. After doing the changes I got the same error: Uncaught TypeError: Cannot read property '_currentElement' of null. I tried with the simplest example I can think of and I get the same error. This issue is closed so I would like to know if I should give up the upgrade for the moment. This is my example:

var ReactRouter = require('react-router');
var Router = ReactRouter.Router;
var Route = ReactRouter.Route;
var React = require('React');
var App = React.createClass({
      render () {
        return ( <div>App</div> )
      }
    });
var routes = <Route component={App} path="*"/>;
var AppRouter = <Router routes={routes} onEnter={()=>console.log("Not printed")} />;
React.render(AppRouter, document.getElementById("div"));

And here I share part of my package.json, just in case it helps:

"dependencies": {
    "flux": "^2.0.3",
    "jquery": "^2.1.4",
    "object-assign": "^1.0.0",
    "react": "^0.13.3",
    "react-bootstrap": "^0.23.7",
    "react-router": "^1.0.0-rc1",
  },
  "devDependencies": {
    "browserify": "^10.1.3",
    "reactify": "^1.1.1",
  },
  "browserify": {
    "transform": [
      [
        "reactify",
        {
          "es6": true
        }
      ]
    ]
  }

[olebedev]

+1 got the same error with basic example from readme file. @ryanflorence could you fix readme or explain what we doing wrong please?

[ashwinr]

ping. Getting the same error as well.

[nhazar]

I had the same issue and in my case it was an issue with how webpack was bundling linked modules. In a more general case, make sure that React is included in your bundle js only once.

[john-osullivan]

Also getting this error. In my case, it arises when the router tries to navigate to a route and the component which that route renders has an error. After that component has an error which prevents the render function from returning (in my case, getMeteorData), attempting to navigate to any other route yields this error.

[xjamundx]

Yay I got this error too. Land on a route, go to another route, then go back to this certain route and 💥 Will post if I can figure mine out, appreciate the other comments...maybe related to facebook/react-devtools#130