Can't resolve '@hotwired/stimulus-loading' Heroku deployment on Rails 7

Question

Help.. As I was deploying to Heroku on my rails app I get this error on the terminal. By the way , I'm using Rails 7.0.1 on Ruby 3.0.3

 Compilation failed:
remote:        [webpack-cli] ModuleNotFoundError: Module not found: Error: Can't resolve '@hotwired/stimulus-loading' in '/tmp/build_bc8927d3/app/javascript/controllers'
remote:            at /tmp/build_bc8927d3/node_modules/webpack/lib/Compilation.js:2014:28
remote:            at /tmp/build_bc8927d3/node_modules/webpack/lib/NormalModuleFactory.js:791:13
remote:            at eval (eval at create (/tmp/build_bc8927d3/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:10:1)
remote:            at /tmp/build_bc8927d3/node_modules/webpack/lib/NormalModuleFactory.js:265:22
remote:            at eval (eval at create (/tmp/build_bc8927d3/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
remote:            at /tmp/build_bc8927d3/node_modules/webpack/lib/NormalModuleFactory.js:427:22
remote:            at /tmp/build_bc8927d3/node_modules/webpack/lib/NormalModuleFactory.js:111:11
remote:            at /tmp/build_bc8927d3/node_modules/webpack/lib/NormalModuleFactory.js:663:25
remote:            at /tmp/build_bc8927d3/node_modules/webpack/lib/NormalModuleFactory.js:848:8
remote:            at /tmp/build_bc8927d3/node_modules/webpack/lib/NormalModuleFactory.js:968:5
remote:        resolve '@hotwired/stimulus-loading' in '/tmp/build_bc8927d3/app/javascript/controllers'
remote:          Parsed request is a module
remote:          using description file: /tmp/build_bc8927d3/package.json (relative path: ./app/javascript/controllers)
remote:            Field 'browser' doesn't contain a valid alias configuration
remote:            resolve as module
remote:              looking for modules in /tmp/build_bc8927d3/app/javascript
remote:                single file module
remote:                  using description file: /tmp/build_bc8927d3/package.json (relative path: ./app/javascript/@hotwired/stimulus-loading)
remote:                    no extension
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/app/javascript/@hotwired/stimulus-loading doesn't exist
remote:                    .js
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/app/javascript/@hotwired/stimulus-loading.js doesn't exist
remote:                    .jsx
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/app/javascript/@hotwired/stimulus-loading.jsx doesn't exist
remote:                    .mjs
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/app/javascript/@hotwired/stimulus-loading.mjs doesn't exist
remote:                    .ts
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/app/javascript/@hotwired/stimulus-loading.ts doesn't exist
remote:                    .tsx
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/app/javascript/@hotwired/stimulus-loading.tsx doesn't exist
remote:                    .coffee
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/app/javascript/@hotwired/stimulus-loading.coffee doesn't exist
remote:                /tmp/build_bc8927d3/app/javascript/@hotwired/stimulus-loading doesn't exist
remote:              /tmp/build_bc8927d3/app/javascript/controllers/node_modules doesn't exist or is not a directory
remote:              /tmp/build_bc8927d3/app/javascript/node_modules doesn't exist or is not a directory
remote:              /tmp/build_bc8927d3/app/node_modules doesn't exist or is not a directory
remote:              looking for modules in /tmp/build_bc8927d3/node_modules
remote:                single file module
remote:                  using description file: /tmp/build_bc8927d3/package.json (relative path: ./node_modules/@hotwired/stimulus-loading)
remote:                    no extension
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/node_modules/@hotwired/stimulus-loading doesn't exist
remote:                    .js
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/node_modules/@hotwired/stimulus-loading.js doesn't exist
remote:                    .jsx
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/node_modules/@hotwired/stimulus-loading.jsx doesn't exist
remote:                    .mjs
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/node_modules/@hotwired/stimulus-loading.mjs doesn't exist
remote:                    .ts
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/node_modules/@hotwired/stimulus-loading.ts doesn't exist
remote:                    .tsx
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/node_modules/@hotwired/stimulus-loading.tsx doesn't exist
remote:                    .coffee
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_bc8927d3/node_modules/@hotwired/stimulus-loading.coffee doesn't exist
remote:                /tmp/build_bc8927d3/node_modules/@hotwired/stimulus-loading doesn't exist
remote:              /tmp/node_modules doesn't exist or is not a directory
remote:              /node_modules doesn't exist or is not a directory

I have this on my gemfile

gem "stimulus-rails"

and I already tried

rails stimulus:install

On my App/Javascipt/Controllers/application.js

 import { Application } from "@hotwired/stimulus"

const application = Application.start()

// Configure Stimulus development experience
application.debug = false
window.Stimulus   = application

export { application }

but still I get the same error every time I deploy it on heroku, the app runs fine locally.

score 2 · Answer 1 · answered May 20 '22 at 13:15

2

As far as I can tell, the @hotwired/stimulus-loading package has not been published to NPM and is meant to be used with importmaps in Rails. If you're instead using webpack, look into @hotwired/stimulus-webpack-helpers.

answered May 20 '22 at 13:15

Hamed

1,382
11
20

learningDev · Answer 2 · 2022-02-28T15:43:47.607

1

Issue fixed ..

I tried commenting out

 import { eagerLoadControllersFrom } from "@hotwired/stimulus-loading"

from App/javascript/controllers/index.js and it works!

PS: this is a temporary fix but will not resolve the main issue

edited Feb 28 '22 at 15:43

answered Feb 23 '22 at 16:44

learningDev

41
1
6

Were you ever able to add this back with import maps? – Chris Hough Apr 23 '23 at 23:49

Can't resolve '@hotwired/stimulus-loading' Heroku deployment on Rails 7

2 Answers2