[Question] How to use assets from a gem using esbuild?

[PedroAugustoRamalhoDuarte]

Hello, i work with a rails old application with multiple gems that adds javascript and css assets to the application like: Katex, boostrap,bootstrap4-datetime-picker-rails, bootstrap-select-rails. Is there an easy way to still use this gems and upgrade my application to use jsbundling-rails with esbuild? The projects uses sprockets and webpacker.

// ./app/assets/javascript/application.js
//= require rails-ujs
//= require activestorage
//= require turbolinks

// Require Bootstrap:
//= require jquery3
//= require jquery.mask
//= require popper
//= require bootstrap-sprockets
....

// ./app/javascript/packs/application.js
import { Application } from "stimulus"
import { definitionsFromContext } from "stimulus/webpack-helpers"

const application = Application.start()
const context = require.context("./controllers", true, /\.js$/)
application.load(definitionsFromContext(context))

I have try to mixed this to file into app/javascript/application.js, but Gem assets could not load, and does not raise any errors.

[walterhorstman]

I have more or less the same question. I have created a Rails 7 application for a webshop. It uses - amongst others - the bootstrap, cssbunding-rails, haml, image_processing (not sure why), jsbundling-rails and propshaft (not sure why) gems and I managed to get this to work. Via bin/dev I have Yarn watching the source files for changes. The webserver is puma-dev, installed via Homebrew.

But this webshop also has an employee portal, written via the not so well-known (but brilliant) JavaScript framework SmartClient. Same application, thus sharing code, but different routes based on domain name. One big problem: that SmartClient framework is written "old school" (as far as I know), not using export defaults, etc.

I managed to bundle this framework's LGPL source files in a (private) gem and I created a (Rails) view helper method to create different JavaScript tags loading the SmartClient framework itself. In a previous version of the application (written in Rails 4.2, which desperately needed upgrading, therefore the Rails 7 project), I tried to bundle my code with the library but since it was megabytes big it gave time-out issues during deployment and the build process itself was too slow during development, so I gave up this approach. I load the framework from the public folder of the gem and added the public folder in the engine.rb file like this:

initializer('<gem name>.static_assets') do |app|
  app.middleware.insert_before(::ActionDispatch::Static, ::ActionDispatch::Static, "#{root}/public")
end

On top of this SmartClient framework I created my own components, which mostly are subclasses of SmartClient components, but taking over some tasks, mostly to have user grants and the communication with the Rails back-end controllers. Ideally I want to bundle this components in one JavaScript file to save HTTP requests. This part fails, but just recently I read that HTTP2.0 solved the "many requests" issues, so now I am wondering if I still need to bundle the files into one Javascript file or simply add a couple of extra script tags in that helper that generated the SmartClient script tags.

My own files can be made using exports, etc. The SmartClient files can not. I managed to load the framework like I did in Rails 4.2, but did not manage to bundle my components in one file.

Quite a long story, but hopefully giving you enough details about the problem. Any help will be highly appreciated!