rails 6 without webpacker

 Rails 6 without Webpacker

Whenever we try to create an application in Rails 6 it comes with WebPacker. The webpacker is the default javascript compiler. It means that all the JavaScript code will be handled by Webpacker instead of the old assets pipeline aka Sprockets.

In this post we will explain how to remove webpacker and add javascript back to the sprockets pipeline.

Webpacker

Webpacker is a gem which allows integration of JavaScript pre-processor and bundler with Rails but it’s very hard to use the webpacker. Webpacker is by default installed whenever we create an application in the rails 6.

When you create a new Rails 6 application, you will see this type of change in the javascript folder.

In the below the rails 6 application application.js file  :

app/javascript/packs/application.js

In the rails 6 application with webpacker.

app/assets/javascript/application.js 

There are the following differences in the javascript folder location in the webpacker and without the webpacker.

How to create an application in rails 6 without using WebPacker.

You can easily create a new application in the rails 6 without using the webpacker by following a few easy commands. 

rails new app-name –skip-webpack-install

By using this command it will skip the webacker in the rails application  but if you want to skip the javascript also then you should go for this command.

rails new app-name –skip-webpack-install –skip-javascript

–skip-webpack-install prevents the generator from running rails webpacker:install.

–skip-javascript drops the webpacker gem from the Gemfile.

How to use javascript in rails 6 as rails 5

Now in rails 6 app/assets/javascripts doesn’t exists so you will have to create it yourself

You can create a folder by the name of Javascript in the app/assets/javascripts/application.js  and add the following lines to it.

//= require jquery

//= require jquery_ujs

//= require turbolinks

//= require_tree .

After requiring the javascript, next open app/assets/config/manifest.js and add the following line in the end

//= link_directory ../javascripts .js

Finally, open your application layout (app/views/layouts/application.html.erb) remove the javascript_pack_tag and add the following line

<%= javascript_include_tag ‘application’, ‘data-turbolinks-track’: ‘reload’ %>

Now you can easily create development in Rails 6 applications without using webpacker. It will be easy for you if you use a small application in the latest rails version.

Why do people want to use Rails 6 without a WebPacker?

The webpacker is dependent on the Yarn and Node. There should be a compatible version of the yarn and node for the webpacker. It is very complicated to go with a webpacker.