Coming from browserify - can't register my root component?

[ttrmw]

Hey,

I'm trying to port an app over from a browserify based approach, so I expect I'll have a bunch of questions.

Right now I'm trying to get my root component registered as a starting point. I've created a directory under bundle, and placed it (and all its children - for now, though I will properly organise this code later) into its components directory.

In startup I've made a clientRegistration file, but this is clearly not being run - I've put a console.log in it and see nothing.

Where am I likely to be going wrong? In my view I have:

<%= react_component("Piper") %>

in my bundle directory I have

bundle
\ 
 piper
  \ 
   components
    \
     Piper.jsx
     {+ others}
   containers
   startup
   \
    clientRegistration.jsx

the Piper component is written in ES5 right now (that wont be a problem, right? I'm hoping to move to ES6 soon, but for now...), and contains:

var React = require("react");
Piper = React.createClass({
//...
});

module.exports = Piper;

And the clientRegistration file contains:

console.log('registering piper?');
var ReactOnRails = require('react-on-rails');
var Piper = require('../components/Piper');

ReactOnRails.register({ Piper});

The console.log never fires, and I see the following error output:

Exception in rendering!
exports.default(options=Object { e=Error: Could not find component registered with name Piper. Registered component names include [ HelloWorldApp ]. Maybe you forgot to register the component?, name="Piper", serverSide=false})app-bun... > eval (line 51)
render()app-bun... > eval (line 108)
forEach(fn=Object { type="object"}, className="js-react-on-rails-component")app-bun... > eval (line 64)
forEachComponent(fn=Object { type="object"})app-bun... > eval (line 54)
reactOnRailsPageLoaded()app-bun... > eval (line 120)
clientStartup/<()app-bun... > eval (line 159)


console.error('Exception in rendering!');

location: http://localhost:3000/assets/generated/app-bundle.self-fb38a30c1f13e994233fe0ad760828cf1e4fcce827f6dc07f50459143b4b225c.js?body=1 line 1125 > eval:69
exports.default(options=Object { type="object"})app-bun... > eval (line 60)
render()app-bun... > eval (line 108)
forEach(fn=Object { type="object"}, className="js-react-on-rails-component")app-bun... > eval (line 64)
forEachComponent(fn=Object { type="object"})app-bun... > eval (line 54)
reactOnRailsPageLoaded()app-bun... > eval (line 120)
clientStartup/<()app-bun... > eval (line 159)


console.error('location: ' + e.fileName + ':' + e.lineNumber);

message: Could not find component registered with name Piper. Registered component names include [ HelloWorldApp ]. Maybe you forgot to register the component?
exports.default(options=Object { type="object"})app-bun... > eval (line 63)
render()app-bun... > eval (line 108)
forEach(fn=Object { type="object"}, className="js-react-on-rails-component")app-bun... > eval (line 64)
forEachComponent(fn=Object { type="object"})app-bun... > eval (line 54)
reactOnRailsPageLoaded()app-bun... > eval (line 120)
clientStartup/<()app-bun... > eval (line 159)


console.error('message: ' + e.message);

Any pointers?

[ttrmw]

Actually, this is me being foolish - clearly registration only occurs on server start, I was expecting to see some attempt to register on page refresh. Restarting the server gives me error output that indicates why the component failed to register, so for now I'm good.