Skip to main content

Using Webpack in Rails with the Webpacker Gem Discussion

General • Asked by Chris Oliver

I wish our front end guys took 20 minutes to set up webpack on a project!


I think breakfast/brunch makes a better job at adding SPA support to rails.

breakfast requires rails 5.0 or greater though


Thanks a lot, Chris, well done !


Nice intro to webpacker. I'm looking forward to how to get it all working smoothly with turbolinks. It helps big time if you want your web app to be speedy on actual mobile devices.


Rails 5.1 is released finally - http://weblog.rubyonrails.o...


Great overview Chris!



how can you use webpacker with angularjs 1?


Thank you for this material, really helpfull!
got stucked with a nested relation, i'm using rails 5.1.
i got this if i try to follow your solution > "{"players.team":["must exist"]}" the solution is to manually add a team_id to the player before call .save in rails. and after.save the current player gets the right id of the "new_team".id.

Table test :

Parameters = {"team"=>{"id"=>nil, "name"=>"testes", "players_attributes"=>[{"id"=>nil, "name"=>"dadada", "_destroy"=>false, "team_id"=>nil}]}}

controller will ignore team_id, in players_attributes as we don't intend to permit it, as long as player id and team id. assuming :

so parameters = { "team"=>{"name"=>"testes","players_attributes"=>[{"name" => "ronaldinho","position" => nil}]}}

team = new(parameters)
team.players.each do player
team.player.team_id = 1
end

team.save

and ok, it works. if i dont use this "gambiarra" each loop it will return
"{"players.team":["must exist"]}

Can you help me? thanks


How do I use SCSS? I tried setting <style lang="scss" scoped> in app.vue but then webpack stopped emitting the .css files entirely.

Update: Chris investigate this during a Slack discussion and found a fix. Use loader/vue.js from webpacker gem's master head, then set const extractStyles = true. https://github.com/rails/we...


i get this error :(

Adding configurations
append .gitignore
Installing all JavaScript dependencies
run yarn add @rails/webpacker [email protected] from "."
ERROR: [Errno 2] No such file or directory: 'add'
Installing dev server for live reloading
run yarn add --dev webpack-dev-server from "."
Usage: yarn [options]

yarn: error: no such option: --dev


Hey Chris!

I was wondering if you've been deploying Webpacker apps with capistrano.

I've been dealing with failures due to Node.js v8.10 running out of memory on 
rake assets:precompile. 

Not sure where to look to fix this issue, since my Webpacker assets aren't that big to begin with. (React + Apollo-client do add some weight the the bundle, plus a couple custom components).

I'm runing on a standard 1GB DO droplet which I'd guess should be enough for now, I'll try increasing it's memory but it doesn't seem like a sustainable solution as my app keeps growing and I add functionality.

Anyways, just wondering if you'd encounterd a similar issue so you could point me towards the right direction to fix it.

Cheers, love your casts and this community.

Felipe

Please break lines to paragraph.

Login or Create An Account to join the conversation.

Subscribe to the newsletter

Join 22,346+ developers who get early access to new screencasts, articles, guides, updates, and more.

    By clicking this button, you agree to the GoRails Terms of Service and Privacy Policy.

    More of a social being? We're also on Twitter and YouTube.