Introducing jQuery in Rails 6 Using Webpacker
What is Webpacker?
What is Webpack?
Webpack is a module bundler.
When we bundle webpack in a project, it traverses the imports, constructing a dependency graph of the project and then generates the output based on the configuration.
What’s Babel then?
Rails 6 jQuery upgrade with webpacker! Read more.
In the previous version of rails, we have to generate an application with – webpacker option for the integration of webpack. But now webpacker is the default and a good replacement of sprockets.
- Rails application generator installs Webpacker gem by default and also runs webpacker:install on its own.
- For Action Cable, its generators will create ES6 stubs rather than use CoffeeScript
Further Reading: Rails 6: Action Mailbox — Explained. Why?How? When?
Some new Defaults of Rails 6
- No more using jquery-rails gem!!!
Now, How we will use Jquery in Rails 6??
In our Rails application run below command to add jQuery.
$ yarn add jquery
It will save the dependency of jquery to our application.
- Now to verify jquery is installed or not, check below files
- package.json =>
- yarn.lock =>
- package.json =>
- Add below code in environment.js
Now, our file looks like,
The path ‘jquery/src/jquery’ indicates the jquery installed in node_modules directory having sub directory ‘jquery/src’ and which contains jquery.js file there.
Require jquery in application.js file.
Voila! Now you should be able to use jquery in your Rails 6 application.
At BoTree Technologies, we build enterprise applications with our Ruby on Rails team of 35+ engineers.
Consulting is free – let us help you grow!
Choose Your Language
Subscribe to Our Newsletter
- Digital Marketing
- IT Consulting
- Project Management