Feature Adding AssetPipeline & ImportMaps #1358
Conversation
…g 500 server errors easier to diagnose
…zes the basic JS to allow for autoreloading & the minimal JS for CRUD
crimson-knight
changed the title
| @@ -0,0 +1,15 @@ | |||
| require "asset_pipeline" | |||
|
|
|||
| FRONT_LOADER = AssetPipeline::FrontLoader.new(js_source_path: Path["src/javascript"], js_output_path: Path["public"]) do |import_maps| | |||
There was a problem hiding this comment.
wdyt of assets/javascript instead?
There was a problem hiding this comment.
I kicked that around. If the deployment doesn't require the entire code base be cloned, then it makes total sense.
But, wouldn't most dockerized/containerized deploys mean the entire code base was cloned into the image and then deployed?
There was a problem hiding this comment.
I would just copy the assets directory to the docker image instead of src/javascript. I think it will actually make creating the image easier.
| @@ -28,8 +28,9 @@ html | |||
|
|
|||
| .main== content | |||
|
|
|||
| script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" | |||
| == FRONT_LOADER.render_import_map_tag | |||
There was a problem hiding this comment.
A bit cosmetic, but maybe a helper function like import_map_tag instead of a constant declared in the initializer could hide a bit of implementation details here.
If the plan is to have import maps as a built in feature, maybe would be worth to deal with it like Amber does with routes and settings, a file config/import_maps.cr with:
Amber::Server.import_maps(source_dir: "src/javascript", output_dir: "public") do |import_maps|
...
endOR, to not fill Amber::Server with frontend stuff:
Amber::ImportMaps.configure(source_dir: "src/javascript", output_dir: "public") do
...
Description of the Change
This is a big step forward in modern JS for Amber!
This change adds the new
import mapsfeature and theasset_pipelineshard for new apps by default. This also has some minimal updates to get the existing client_reload feature working and get theBenefits
Possible Drawbacks
Using module-based JS does require a different approach than what most backend devs are probably comfortable with. If you're accustomed to the standard of just putting plain JS into a file and it executes on it own, this is going to be a bit different.