ReactHabitat.createBootstrapper is not a function

[alfonsogrondo]

I'm new to React and feel I'm missing something fundamental here. This is my root 'App.js' code:

var ReactHabitat = require('react-habitat');
var SearchModule = require('./_modules/search/Search.js');

function MyApp() {

  this.domContainer = ReactHabitat.createBootstrapper({

    // Create a new container
    container: [

      // Register your top level component(s)
      {register: 'inline-search-container', for: SearchModule},
      {register: 'booking-search-container', for: SearchModule}
    ]
  });

}

exports.MyApp = new MyApp();

react-habitat is definitely installed and I'm using Browserify to manage the packages I need for the app.

I get 'ReactHabitat.createBootstrapper is not a function' in the console after firing up the server.

Any ideas?

Thanks

[alfonsogrondo]

Interestingly if I call the createBootstrapper function this way: ReactHabitat.default.createBootstrapper({..}); then all is well with the world!?

[jennasalau]

Ahh yes it seems Babel 6 which (we are using) doesn't export the default module.exports anymore. https://github.com/babel/babel/issues/2212

So the correct way to import our module in ES5 would be :

var ReactHabitat = require('react-habitat').default;

So you were close :)

We will need to update the docs to show this or.. look at implementing a babel plugin to set the exports (which I'm leaning to).

In the mean time please use the above code which is a perfectly valid pattern.

Thanks for opening the issue. Jenna

[alfonsogrondo]

Thants @jennasalau, I've updated the module import to above and works fine.

[jennasalau]

Re-opening because we will address this in the next release.

[jennasalau]

This is now resolved.. As of v0.3.0 please use var ReactHabitat = require('react-habitat'); as per the docs.