Questions tagged [webpacker]

Webpacker is a Ruby gem for Ruby on Rails that makes it easy to use Webpack, the JavaScript module bundler, to manage application-like JavaScript in Rails. It coexists with the asset pipeline and can even replace it by processing CSS, images, fonts, and more.

Features

License

MIT

Links

GitHub

RubyGems

728 questions
82
votes
6 answers

How to import and use image in a Vue single file component?

I think this should be simple, but I am facing some trouble on how to import and use an image in Vue single file component. Can someone help me how to do this? Here is my code snippet:
aks
  • 6,072
  • 4
  • 43
  • 68
35
votes
5 answers

Using Rails-UJS in JS modules (Rails 6 with webpacker)

i just switched to Rails 6 (6.0.0.rc1) which uses the Webpacker gem by default for Javascript assets together with Rails-UJS. I want to use Rails UJS in some of my modules in order to submit forms from a function with: const form =…
R4ttlesnake
  • 1,481
  • 2
  • 16
  • 26
25
votes
4 answers

How to handle images in a Rails / Webpacker / React app?

I am using Webpacker with rails 5.1.4 to play with React, Redux, and react-router-dom. I have a Navbar.jsx component in app/javascript/src/components/ that needs to display an image, but I am not able to access my images stored in…
adesurirey
  • 2,204
  • 1
  • 9
  • 31
25
votes
9 answers

stylesheet_pack_tag not finding app/javascript/src/application.css in rails 5.1 with webpacker gem

I am receiving this error when I try to load a page in my new rails 5.1 app using webpacker. I would like webpacker to handle CSS as well. Started GET "/" for ::1 at 2017-09-01 12:20:23 -0400 Processing by HomeController#welcome as HTML Rendering…
wuliwong
  • 3,687
  • 8
  • 35
  • 60
22
votes
0 answers

Slow sass-loader Build Times with Webpack

Summary When we switched to using Webpack for handling our SASS files, we noticed that our build times in some cases became really slow. After measuring the performance of different parts of the build using the SpeedMeasurePlugin, it seems that…
mc92
  • 295
  • 3
  • 9
18
votes
5 answers

How to add jquery third party plugin in rails 6 webpacker

I know its simple but with update of rails 6. there is new syntax in rails 6 for manage javascript assets which is maintained by webpacker. //application.js require("@rails/ujs")…
uzaif
  • 3,319
  • 2
  • 17
  • 30
18
votes
2 answers

Webpacker in Rails 5 takes a long time to compile not that many files. How can I see what it's doing?

[Webpacker] Compiling… It takes several seconds (6.2 seconds) to compile any of my changes to javascript files. It's really slowing my JS development down. Is there any way to see what Webpacker in Rails is doing and which files it's spending most…
cmrichards
  • 1,679
  • 16
  • 25
17
votes
5 answers

Using Rails 6, where do you put your “page specific” JavaScript code?

My question here is the same as Using Rails 3.1, where do you put your "page specific" JavaScript code?, just for Rails 6 instead of Rails 3.1. Suppose I have some JavaScript that I want to use for my posts index page. Where do I put that file, and…
Adam Zerner
  • 12,221
  • 13
  • 62
  • 128
15
votes
4 answers

How to use cocoon gem in Rails 6

Have been using cocoon gem for nested forms in rails 4 & rails 5 apps. Currently, I was updating one of the rails 5.2 app (which is using cocoon gem) to rails 6. As rails 6 is using webpacker, so I tired to require cocoon javascript in…
Sikandar Tariq
  • 1,156
  • 1
  • 12
  • 26
15
votes
4 answers

how to use js files from Gem in rails 6 application

So I have been using rails for quite a while. But with Rails 6 I have been really struggling to get moving. I have some custom gems I use for assets and things and I cannot figure out how to load the js files. What I am used to application.js //=…
Rockwell Rice
  • 3,541
  • 4
  • 28
  • 48
15
votes
4 answers

Rails 5/6: How to include JS functions with webpacker?

I am trying to update a Rails 3 app to Rails 6 and I have problems with the now default webpacker since my Javascript functions are not accessible. I get: ReferenceError: Can't find variable: functionName for all js function triggers. What I did…
SEJU
  • 725
  • 7
  • 21
15
votes
2 answers

How to add multiple source_path in Rails Webpacker

We are using Webpacker for loading JavaScripts and CSS files into the webpage. Currently, in webpacker.yml we have set the source_path to app/javascript. Which is working fine to load the JavaScript files form this directory. But in our application,…
Dipak
  • 5,512
  • 6
  • 50
  • 78
15
votes
2 answers

Rails + webpacker + vue: "You are using the runtime-only build of Vue where the template compiler is not available."

I've created a new rails 5.2 application and installed vue with: bundle exec rails webpacker:install:vue After creating a simple endpoint Home#landing and adding <%= javascript_pack_tag 'hello_vue' %> to the default layout the sample app is working…
pragmatic_programmer
  • 3,138
  • 2
  • 23
  • 34
15
votes
5 answers

How to access assets with webpacker gem

Could you explain me how to access assets from webpacker gem within vue.js components? For example - how to create div with background image. I've tried use /app/assets/images and /app/javascripts/assets folders but images is only available in…
Alexey Poimtsev
  • 2,835
  • 3
  • 31
  • 61
14
votes
2 answers

When to use stylesheet_pack_tag instead stylesheet_link_tag with Rails 6

When creating a new rails project with Rails 6, it creates an application.html.erb with stylesheet_link_tag to load CSS and javascript_pack_tag for javascript files. Now, rails 6 also provide a stylesheet_pack_tag, so my question is, when to use it?…
Sanjay Prajapati
  • 475
  • 4
  • 13
1
2 3
48 49