Trouble Moving Files from app/assets/images to Packs in Rails, Help Needed!

This message was imported from the Ruby/Rails Modularity Slack server. Find more info in the import thread.

Message originally sent by slack user U71TN2WF04X

Hi everyone :wave: Has anyone moved files from app/assets/images/... into packs? Im struggling to make it work as it does not appear on my public/packs/manifest.json :cry:

I was looking at this too, recently, have not yet found a solution to exactly this. You can make public folders if you add this to application.rb

middleware.use ::ActionDispatch::Static, File.expand_path(File.join(__FILE__, "../../packs/agile_landscape/public"))

<@U71TN2WF04X> you mention app/assets/images/... and then public/packs/manifest.json but app/assets is normally handled by sprockets (or propshaft) while the files in public/packs/ are normally generated by webpacker. :thinking_face: or so I remember.

In my experience, weā€™ve been able to move all files from app/assets/* into packs like packs/something/app/assets/* without much trouble.

but we havenā€™t been able to move the files from app/javascripts/* which are the ones handled by webpacker. We didnā€™t try too hard because itā€™s not the focus yet, though.

Message originally sent by slack user U71TN2WF04X

Yes, I am working with webpacker, and the source file in my webpacker config is apo/assets. I forgot that

oh, so youā€™re using app/assets instead of app/javascripts for webpacker

wellā€¦ I canā€™t help then because we decided to leave all webpacker-related stuff in the main app for now. :sweat_smile:

Weā€™ll most probably migrate out of webpacker to other stuff. Weā€™ve already migrated all our JS code to use importmap. The only code left in webpacker is CSS for now.

<@U71TN2WF04X> this might be a shoot in the dark, but did you try adding your packsā€™ assets directories to the additional_paths setting in config/webpacker.yml? That might work.

Message originally sent by slack user U71TN2WF04X

Yeah that was my first try :confused: but with no success. I will keep on searching, thanks :slightly_smiling_face:

Message originally sent by slack user U712YWCKK8T

We have all web assets inside their respective packages, including JavaScript, and Tailwind-generated CSS

Message originally sent by slack user U712YWCKK8T

Main thing that helped was switching to propshaft which allows you to not have to maintain the manifest.js file https://github.com/rails/propshaft

Message originally sent by slack user U712YWCKK8T

We also use esbuild rather than webpacker, not sure how easy it is to replicate. I built a system that detects *.esbuild.js/ts files inside a pack, and creates a Rake task to build that file using esbuild

Message originally sent by slack user U712YWCKK8T

(Similarly *.postcss.css for CSS files)

The ā€œmigrating from sprocketsā€ section in the propshaft readme is extremely short. Any tips on good resources to do the switch?

This has a lot more info, but ā€¦ somehow most of it doesnā€™t immediately work for meā€¦ Will keep exploring

Message originally sent by slack user U712YWCKK8T

(seems you linked to an internal Slack rather than the Propshaft docs in your first message)

Itā€™s been like a year since I switched, I donā€™t remember if I did anything more than follow those instructions. I donā€™t remember it being particularly difficult though once the switch off of Webpacker was done.

Minor note, we donā€™t use jsbundling-rails or cssbundling-rails since all they really do is add rake tasks to build a single JS/CSS file, since we have multiple files across packs I made custom rake tasks for them instead.

Message originally sent by slack user U712YWCKK8T

Found the commit, the only extra thing it has is configuring InlineSvg::PropshaftAssetFinder

dang, yes I did (link to slack)