Reputation: 6515
I am using Rails 7 with esbuild, jsbundling-rails, and importmap-rails. I am using the following command to start the esbuild watcher:
esbuild app/javascript/*.* --bundle --sourcemap --format=esm \
--outdir=app/assets/builds --public-path=/assets --watch=forever
Most of my JavaScript code is structured as ESM modules. These are not referenced in app/javascript/application.js
.
With this setup, I have observed the following:
esbuild is not compiling ESM modules into app/assets/builds
. The only file that generates there is application.js
, which (after compilation) contains my legacy, non-ESM code.
javascript_include_tag "application", type: "module"
generates a URL to [host]/javascripts/application.js
.
javascript_importmap_tags
generates an import map with entries like "application": "/application.js"
.
The Rails development server doesn't appear to be serving files from app/assets/builds
. I have tried sending HTTP requests to [host]/application.js
, [host]/javascripts/application.js
, [host]/assets/application.js
, and [host]/assets/builds/application.js
. All of these paths return 404.
Some of the above may be the way Rails is designed to work. But I'm clearly doing something wrong, because I can't generate working URLs to any JavaScript files, whether manually or with helpers.
What I would have expected to see is:
The Rails development server serves JavaScript files from whatever folder esbuild compiles into. (In this case, app/assets/builds
.)
All JavaScript files, including ESM modules, get compiled into the destination folder.
The helpers javascript_include_tag
and javascript_importmap_tags
generate working URLs for JavaScript files.
I want to follow the most bog-standard conventions for a modern Rails app. I am not wedded to any of the dependencies I have identified above. But I do want some sort of JavaScript build stage (partly so that I can start using TypeScript). Nor am I wedded to compiling into app/assets/builds
: I chose that folder only because I understood that to be the convention.
With that in mind, my questions are:
Is the setup I've described consistent with the typical conventions for a Rails 7 app that needs a JavaScript build stage?
Do import maps and esbuild complement each other, or should I pick just one? Relatedly, should I be using both javascript_include_tag
and javascript_importmap_tags
?
What should I change so that I can generate working URLs for my JavaScript files?
Upvotes: 0
Views: 44