Rails 7: javascript_include_tag issue

Question

I have a rails 7 app and I'm NOT using the javascript_importmap or the @hotwire/stimulus. I have a custom js file in here app/javascript/custom/feature/categories.js. The file loads with this import './custom/feature/component.js'; inside the application.js. The issue is that I want to load that file only on a specific html.erb view page.

So I'm trying to do it like this: I place this <%= javascript_include_tag 'app/javascript/custom/feature/categories.js' %> inside the .html.erb view file but I'm getting this error: The asset "app/javascript/custom/feature/categories.js" is not present in the asset pipeline.

Any ideas what Im doing wrong??

Answer 1

In Rails 7, to add a custom JS using the asset pipeline, first let Rails asset pipeline know where your custom JS files are by adding the reference in the app/assets/config/manifest.js.

//= link_tree ../../javascript .js

This tells Rails to search for your JS files in any folders in app/javascripts directory. (This code should already be there by default, if not then add this line.)

Then add the javascript_include_tag on the top of any pages as:

   <%= javascript_include_tag "custom/feature/categories" %>

Make sure, your customer JS file are stored in the folder /app/javascripts folder.