6

I am using react-rails and browserify. In the application.js I use 

// require react
// require react-ujs

Also I use tcomb-form by using 

var t=require("tcomb-form")

As the result I saw reactjs is included twice in my asset pipeline.

How should I correctly use reactjs with rails?

EDIT:

by the way, if you see this error in your console, probably you are having the same issue with reactjs got included twice. 

[Error] Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. This usually means that you're trying to add a ref to a component that doesn't have an owner (that is, was not created inside of another component's render method). Try rendering this component inside of a new top-level component which will hold the ref.
Gabriele Petronella
  • 106,943
  • 21
  • 217
  • 235
ziweizhou
  • 165
  • 7

3 Answers3

1

I found that react was being referenced twice in 

app/assets/javascripts/server_rendering.js

When I removed the line 

//= require react-server

it fixed my issues and got rid of the addComponentAsRefTo() error. Please bear in mind that I have not tried to deploy the app yet, but this worked for getting it to crud.

jesser360
  • 11
  • 1
0

by the way, the workaround I came up with is to remove the following from application.js

// require react
// require react-ujs

and just copy and paste the source code for react-ujs in application.js and use 

var React = require("react");

I know it is not elegant, if you have any better suggestions, please let me know.

ziweizhou
  • 165
  • 7
0
//= require_self
//= require react_ujs

global.React = require('react');

This is how I'm using react with Browserify & Rails. Sets us up for testing as well.

Cory Z A
  • 74
  • 3
  • i will try, so your way react_ujs doesn't complain about not being able to find React? – ziweizhou May 04 '15 at 02:46
  • sorry it doesn't work, unless you declare React as a global variable. otherwise react_ujs will complain it cannot find React. Uncaught ReferenceError: React is not defined – ziweizhou May 05 '15 at 05:58
  • Aye. I mis-typed it, should've gone on the global scope. Fixed above. Another way I've been trying to get server side rendering to work is to precompile / browserify and require the bundle above react_ujs. Still working on that and setting up Mocha tests. – Cory Z A Jun 15 '15 at 23:21