hi, when i create turbo_streams folder and the index.js and toast.js file and I get error in console in index.js import "./toast.js" line. GET http://localhost:3000/assets/toast net::ERR_ABORTED 404 (Not Found) i try to but nothing i tried rails assets:precompile but it didn't help either how can i solve it?
If you are using rails 7, chances are you are using the new importmap feature. Rails 7 is loading Turbo through the turbo-rails gem and importmap '@hotwired/turbo-rails', like so:
# config/importmap.rb
# you should see the following line
pin "@hotwired/turbo-rails", to: "turbo.min.js", preload: true
To access TurboStreams, don't import `@hotwired/turbo` nor `StreamActions`. Instead use Turbo made available in the window:
# app/javascript/turbo_streams/toast.js
# here we removed import { StreamActions } from ...
# and we use Turbo made available with turbo-rails gem instead
window.Turbo.StreamActions.toast = function() {
...
}
The new importmap feature aims to remove yarn dependency. To use toastify-js, you can add it to your config>importmap.rb
# config/importmap.rb
pin "toastify-js", to: "https://ga.jspm.io/npm:toastify-js@1.12.0/src/toastify.js"
when i create turbo_streams folder and the index.js and toast.js file and I get error in console in index.js import "./toast.js" line.
GET http://localhost:3000/assets/toast net::ERR_ABORTED 404 (Not Found)
i try to but nothing
i tried rails assets:precompile but it didn't help either
how can i solve it?
Yes I use importmap and imported toastify-js via importmap pin toastify-js
To access TurboStreams, don't import `@hotwired/turbo` nor `StreamActions`. Instead use Turbo made available in the window:
# app/javascript/turbo_streams/toast.js # here we removed import { StreamActions } from ... # and we use Turbo made available with turbo-rails gem instead window.Turbo.StreamActions.toast = function() { ... }Hope that helps.