Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Webpacker support #234

Closed
lourenci opened this issue Dec 22, 2017 · 7 comments
Closed

Webpacker support #234

lourenci opened this issue Dec 22, 2017 · 7 comments

Comments

@lourenci
Copy link

Is there a way to load routes.js file throught webpacker?

@bogdan
Copy link
Collaborator

bogdan commented Dec 29, 2017

Currently there is no way to make routes.js update automatically with webpack. You should either switch to static file and update it manually with rake task or include it separately via sprockets:

= javascript_include_tag 'js-routes'

I am open to any proposal how to improve the process.

@lourenci
Copy link
Author

I solve this in my project in a different way:
I changed the config file to export the generated routes file to the webpack javascript path. In my entry file, I used the expose-loader to put it on global object.

@jorisvh
Copy link

jorisvh commented Mar 5, 2018

The routes will be assigned to this, so this is what my module looks like :

var routes = {};

(function() {
    <%= JsRoutes.generate(namespace: "Namespace") %>
}.call(routes));

export default routes.Namespace;

@bogdan
Copy link
Collaborator

bogdan commented Mar 6, 2018

Where do you put this file? How do you compile the erb? How do you keep the compiled file up to date on each routes.rb change?

@jorisvh
Copy link

jorisvh commented Mar 6, 2018

I just created a file with the extension .js.erb and I import it in my packs. Webpacker compiles the erb just like Sprockets does.

But yes, the compiled file won't be updated automatically on each route change (our ugly trick is actually to update the first line of the file with a comment containing the current time each time we change our routes). If you have any idea how to dispense with that, that would make my day !

@padi
Copy link

padi commented Apr 12, 2018

@jorisvh Thanks you for the explanation. I've since improved upon it. Your timestamp comment is not far off from the solution to the auto-update problem you were having. If you're referring to bin/webpack-dev-server's hot reloading, you can add a magic comment that watches a file for changes!, i.e.:

/* rails-erb-loader-dependencies ../config/routes */
var routes = {};

(function() {
    <%= JsRoutes.generate(namespace: "Namespace") %>
}.call(routes));

export default routes.Namespace;

This will watch for changes in config/routes.rb🥂 🎉

For more info, just check out rails-erb-loader, which webpacker uses under the hood.

@dkniffin
Copy link

dkniffin commented Jun 8, 2018

@padi Thanks so much for that add-on to the solution. This is all great! I wanted to add a little more info for clarity:

  1. You'll need to install .erb support in webpacker: bundle exec rails webpacker:install:erb source
  2. You'll probably want to add .js.erb to the list of extensions in config/webpacker.yml
  3. Create a file in app/javascript called routes.js.erb with the above code.
  4. In your ES6 code, import it like you normally would with import '../routes'

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants