Using React router with react-rails gem

Question

I am an experienced ruby on rails developer and trying to use reactjs with it. So I installed react-rails gem and followed the instructions.

There are two possible approaches to get started:

1. Using asset pipeline
2. Using webpacker

Webpacker gem looks pretty new and I had hard time getting the webpacker-dev-server work with my current rails app. And also running two process using foreman (one for rails and one for webpacker) looks too many dependency.

So I went ahead with asset pipeline approach by placing all my React components in app/assets/javascripts/components/MyComponent.jsx . Everything works fine and I am able to render the component using <%=reach_component("MyComponent")%>

Now I want to design a Single Page app around it. Hence I started exploring about react-router . But there is no proper explanation on how to use react-router with react-rails gem.

I tried adding the react-router package in packages.json and ran yarn but ended up with the following error on browser after all the include.

Uncaught ReferenceError: exports is not defined

Any help on getting started with react-router and rails without webpack and without using babel in browser and making client heavy ?

Answer 1

The browser error is because you've got CommonJS code (ie exports statements) that is not being translated into a format suitable for running on the browser.

I haven't tried to get React running in rails so am not sure if the asset pipeline is capable of working with node libraries, but you might need to consider switching your approach to something like this:

http://blog.arkency.com/2015/03/gulp-modern-approach-to-asset-pipeline-for-rails-developers/