I'm currently trying Rails 6.0.0.rc1 which seems to have moved the default javascript
folder from app/assets/javascript
to app/javascript
. The application.js
file is now located in app/javascript/packs
. Now, I want to add a couple of js files, but for some reason they don't get imported and I can't find any documentation on how this can be done in Rails 6. I tried a couple of things:
Create a new folder
custom_js
underapp/javascript/packs
, putting all my js files there and then add arequire "custom_js"
toapplication.js
.Copy all my js files under
app/javascript/channels
(which should be included by default, sinceapplication.js
hasrequire("channels")
).Adding
require_tree .
toapplication.js
, which was the previous approach.
How can I load my own js files inside a Rails 6 application?
Get better-organized code and avoid multiple javascript_pack_tags in your application.html.erb file with this approach:
- Add your custom
example.js
javascript file toapp/javascript/packs
. - Add
require("packs/example.js")
to yourapplication.js
file.
I would have liked to add a comment to Asim Hashmi's correct answer. But I don't have enough reputation, so I'll add my suggestion as an answer instead.
You need to do the following steps to add custom javascript file to rails 6 (webpacker)
1.Create your custom file named custom.js
in app/javascript/packs
directory.
For testing purpose, write any console.log
in it.
// app/javascript/packs/custom.js
console.log("custom js file loaded")
2. Go to your application.html.erb
and add the following line at the end of your <head></head>
<%= javascript_pack_tag 'custom', 'data-turbolinks-track': 'reload' %>
3. Now execute rake assets:precompile
This will pack your javascript code (including our custom file we just added)
Now reload your page and you should see the message
custom js file loaded
in your browser console
Hope it helps :)
来源:https://stackoverflow.com/questions/56242664/how-to-require-custom-js-files-in-rails-6