Sorry for the lack of formatting, I'm new here. I've recently started making a switch from jQuery to React in my app. I removed all the little js code, installed turborails and importmap, planning to use a mix of html and rails for my pages. I managed to get the app working locally and all, but in the heroku build, the application.js doesn't import the dependencies, displaying:

uncaught syntaxerror: import declarations may only appear at top level of a module

when I check the console in developer tools, at this

I'm using importmap and including the app.js through a javascript_include_tag This is how my application.jss looks. The error points to the hotwired line

import "@hotwired/turbo-rails"
import "./components/seconds.jsx"

How can I make it work in heroku?

EDIT: Through some messy trial and error, I figured out a solution. So it seems that browsers don't support import without being modules? So my solution was to build the application.js and replace my previous application.js with the built version. It works both locally and on heroku, though a minor nuisance is that I'll have to npm build every time I alter something in my javascript and need to push it, but it's doable.