I'm new to Ruby on Rails so I wanted to understand how the JavaScript directories are managed in a Rails application!
1. What is the difference between the three directories:
project-name/app/assets/config
: contains JS files:project-name/app/javascripts/channels
: contains JS files:project-name/app/javascripts/packs
: contains JS files
In my case these files have the following contents:
project-name/app/assets/config/manifest.js:
//= link_tree ../images
//= link_directory ../stylesheets .css
---------------------------------------------------------------------------
project-name/app/javascripts/channels/consumer.js:
// Action Cable provides the framework to deal with WebSockets in Rails.
// You can generate new channels where WebSocket features live using the `bin/rails generate channel` command.
import { createConsumer } from "@rails/actioncable"
export default createConsumer()
---------------------------------------------------------------------------
project-name/app/javascripts/channels/index.js:
// Load all the channels within this directory and all subdirectories.
// Channel files must be named *_channel.js.
const channels = require.context('.', true, /_channel\.js$/)
channels.keys().forEach(channels)
---------------------------------------------------------------------------
project-name/app/javascripts/packs/application.js:
// This file is automatically compiled by Webpack, along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant structure within app/javascript and only use these pack files to reference
// that code so it'll be compiled.
import Rails from "@rails/ujs"
import Turbolinks from "turbolinks"
import * as ActiveStorage from "@rails/activestorage"
import "channels"
Rails.start()
Turbolinks.start()
ActiveStorage.start()
What I basically want to do is execute is execute ruby code with sweetalert2
JavaScript. But I found out that this is impossible to do (see my other question: How to execute a rails command with sweet alert 2?)
I found out that referencing JavaScript files using cdn (e.g.<script src="//cdn.jsdelivr.net/npm/sweetalert2@10"></script>
) is not of common use, and that Rails prefer using gems (e.g. <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
). So that lead to the following questions:
After installing a gem (add gem 'jquery-rails'
in Gemsfile and then bundle
on terminal), most tutorials will add the //= require jquery
in project-name/app/assets/javascripts/application.js
but I don't have that file!
- Where do I have to provide
//= require <gem-name>
from the above directories?
- Where do I want to add my custom JavaScript files (for the moment I'm using the following directory:
project-name/app/views/friends/javascripts/<my-JS-Files>
) but I know that's wrong!