Hi – Thanks for doing this! It’s quite a setup, and it almost works.
With the default settings, I get proper JSX compilation, except it doesn’t compile javascript generators to ES5 code. This works fine with Chrome, but fails with Safari.
I’m trying to move a project over from react-rails, which uses the “regenerator-runtime” code to allow generator use with ES5.
Hey Justin – thanks much! It’s working fine now. You guys rock! Keep up the good work!
Ha ha, oops, I lied, it doesn’t work. Turns out that there is some other code which is putting generators into the output, and I can’t figure out where they’re coming from (it’s not my code). Any clue on how to find out where (say) section 215 of the app/assets/javascripts/generated/client-bundle.js file comes from?
Observe how the bundles are automatically re-generated whenever your JSX changes.
But I can’t find the code that automatically re-generates the bundle or that automatically calls npm run build:dev. Can you please give me some advise on how to understand this?.. I know how the hot-module-reload works when requesting directly the Webpack Dev Server but not sure about how the bundles are automatically regenerated whenever I change the JSX
The other question I have is, how should I manage I18n? … Is there a way to integrate Rails I18n into this React+Webpack+Rails integration?
About the I18n I was thinking that maybe a good approach would be to write a railsi18n-loader for Webpack that can read/load the config/locales/*.es.yml files (or any .yml file). I’d love to write it but currently I don’t have the time because of a project we just started, using the react_on_rails gem
I hope I can contribute at least with ideas if not with code based on our experience using the gem.
Are there any common gotchas or setup problems with HMR that I should know about. I haven’t attempted any extensive debugging just yet, but I’ve installed, and reinstalled, the react-webpack-rails-tutorial from scratch with no modifications, and I can’t get the hot module replacement to work. Are there any browser dependencies I should know about? Common environmental problems?
The watcher recognizes the changes and rebuilds the bundle, but the browser isn’t responding. I’m not sure what to be looking for in the server logs (outside of the webpack rebuild) to indicate this is working. Any help would be greatly appreciated.
we were trying to get rails + react + webpack working within Docker (prod + dev env), do you guys have a best practice for this?
using react_on_rails but to few knowledge in webpack got super confusing and so we put it on hold (asking us if it is the right approach)
But trying two docker container (rails and webpack) with a shared volume where webpack compiles the bundle.js and rails can just use it, does not run yet either.
I googled everything so far for any best practice solutions but it seems as nobody has done that yet (until the end!1) which I can not believe. Docker + Rails + Webpack + React seems to be a perfect synergy.
Thank you for any respond,
Bjoern
1 note: there is a great tutorial from Kevin Robinson out there but it doesn’t go far enough for us.
Main issue to get rails, react and webpack running in a development docker container.
using the react-webpack-rails-tutorial. We tried to setup the whole app within docker. Unfortunatly we do get a: "FATAL: Listen error: unable to monitor directories for changes."
Fixing via echo fs.inotify.max_user_watches=524288 | tee -a /etc/sysctl.conf && sysctl -p and using foreman start -f Procfile.static didn’t fix it.
using two docker container (webpack && rails app): we get swagger-ui.js?12e9:9Uncaught ReferenceError: Handlebars is not defined. Fixing via var Handlebars = require('handlebars/runtime.js'); or var Handlebars = require('handlebars'); does not solve the issue.
So again, the question is more for finding the best framework to setup a react + rails + docker application.
Thank you for any wing in the right direction.
best, bjoern