0

I'm using Rails with react-rails gem. Server side works perfect, but recently I added react-bootstrap to the project.

All good, except the fact that react-server references twice the react script, which causes inconsistencies with the react-bootstrap

Let me show you. Inside my application.js I reference the following:

..
//= require react
//= require react_ujs
//= require react_bootstrap
//= require utils
//= require components
..

Inside components

..
//= require react-server
//= require stuff
..

I render component using react_component, with prerender: true. It works great, but if you use, let's say, Input (from React-bootstrap) then it complains about addToRef error, which is caused by multiple react referencing

If I remove react/react_ujs then I no longer have React on the client. If I remove react-server then I no longer have react on server. But if I remove react-server then React-bootstrap no longer complains about multiple references

Is there are way to use react server side together with React-bootstrap?

Rares Mardare
  • 193
  • 1
  • 4
  • 13

1 Answers1

0

react-server and react both have full copies of React! The only difference is that react-server also includes ReactDOMServer.

I think for components.js you could have:

//= require react-server 
//= require stuff 

Then in application.js

//= require components 
//= require react_ujs

I use a similar arrangement because i need ReactDOMServer.renderToString in the browser.

rmosolgo
  • 1,854
  • 1
  • 18
  • 23