I am trying to deploy my rails 6 blog-like app to Heroku and since I've added Bootstrap to do some styling I haven't been able to compile and push anymore. This is the message I am getting:
ModuleNotFoundError: Module not found: Error: Can't resolve '@popperjs/core'....
If somebody knows how to fix this error, please let me know.
The code can be found here : https://github.com/parK-dev/Alpha-Blog
Note that this is my first try at Rails and I am new to development, clear instructions would be appreciated, thank you.
-----> Building on the Heroku-20 stack
-----> Ruby app detected
-----> Installing bundler 2.1.4
-----> Removing BUNDLED WITH version in the Gemfile.lock
-----> Compiling Ruby/Rails
-----> Using Ruby version: ruby-3.0.0
-----> Installing dependencies using bundler 2.1.4
Running: BUNDLE_WITHOUT='development:test' BUNDLE_PATH=vendor/bundle BUNDLE_BIN=vendor/bundle/bin BUNDLE_DEPLOYMENT=1 bundle install -j4
Using rake 13.0.3
Using concurrent-ruby 1.1.8
Using i18n 1.8.8
Using minitest 5.14.3
Using tzinfo 2.0.4
Using zeitwerk 2.4.2
Using activesupport 6.1.1
Using builder 3.2.4
Using erubi 1.10.0
Using racc 1.5.2
Using nokogiri 1.11.1 (x86_64-linux)
Using rails-dom-testing 2.0.3
Using crass 1.0.6
Using loofah 2.9.0
Using rails-html-sanitizer 1.3.0
Using actionview 6.1.1
Using rack 2.2.3
Using rack-test 1.1.0
Using actionpack 6.1.1
Using nio4r 2.5.4
Using websocket-extensions 0.1.5
Using websocket-driver 0.7.3
Using actioncable 6.1.1
Using globalid 0.4.2
Using activejob 6.1.1
Using activemodel 6.1.1
Using activerecord 6.1.1
Using mimemagic 0.3.5
Using marcel 0.3.3
Using activestorage 6.1.1
Using mini_mime 1.0.2
Using mail 2.7.1
Using actionmailbox 6.1.1
Using actionmailer 6.1.1
Using actiontext 6.1.1
Using msgpack 1.4.2
Using bootsnap 1.7.0
Using bundler 2.2.3
Using ffi 1.14.2
Using jbuilder 2.11.2
Using method_source 1.0.0
Using pg 1.2.3
Using puma 5.2.0
Using rack-proxy 0.6.5
Using thor 1.1.0
Using railties 6.1.1
Using sprockets 4.0.2
Using sprockets-rails 3.2.2
Using rails 6.1.1
Using sassc 2.4.0
Using tilt 2.0.10
Using sassc-rails 2.1.2
Using sass-rails 6.0.0
Using semantic_range 2.3.1
Using turbolinks-source 5.2.0
Using turbolinks 5.2.1
Using webpacker 5.2.1
Bundle complete! 17 Gemfile dependencies, 57 gems now installed.
Gems in the groups development and test were not installed.
Bundled gems are installed into `./vendor/bundle`
Removing bundler (2.1.4)
Bundle completed (0.55s)
Cleaning up the bundler cache.
-----> Installing node-v12.16.2-linux-x64
-----> Installing yarn-v1.22.4
-----> Detecting rake tasks
-----> Preparing app for Rails asset pipeline
Running: rake assets:precompile
yarn install v1.22.4
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
[1/4] Resolving packages...
[2/4] Fetching packages...
info [email protected]: The platform "linux" is incompatible with this module.
info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
info [email protected]: The platform "linux" is incompatible with this module.
info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning " > [email protected]" has unmet peer dependency "@popperjs/core@^2.5.4".
warning " > [email protected]" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning "webpack-dev-server > [email protected]" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
[4/4] Building fresh packages...
Done in 26.67s.
I, [2021-02-11T21:45:58.554126 #303] INFO -- : Writing /tmp/build_f6d49c25/public/assets/jumbotron-4e5a1586b8afb6f5e26722d19ec0227e803b1d6618993041f7e1411fffc5bb69.jpg
I, [2021-02-11T21:45:58.555799 #303] INFO -- : Writing /tmp/build_f6d49c25/public/assets/application-c7c465c57bf58300b796315902849aa287f9b5b88a643b887e9e748ebb91f409.css
I, [2021-02-11T21:45:58.556164 #303] INFO -- : Writing /tmp/build_f6d49c25/public/assets/application-c7c465c57bf58300b796315902849aa287f9b5b88a643b887e9e748ebb91f409.css.gz
I, [2021-02-11T21:45:58.556594 #303] INFO -- : Writing /tmp/build_f6d49c25/public/assets/jumbotron-4e5a1586b8afb6f5e26722d19ec0227e803b1d6618993041f7e1411fffc5bb69.jpg
I, [2021-02-11T21:45:58.557113 #303] INFO -- : Writing /tmp/build_f6d49c25/public/assets/custom-7137798345420ff198a899149dea901836a9003f4d0caf633b5ec120aeb44dba.css
I, [2021-02-11T21:45:58.557217 #303] INFO -- : Writing /tmp/build_f6d49c25/public/assets/custom-7137798345420ff198a899149dea901836a9003f4d0caf633b5ec120aeb44dba.css.gz
I, [2021-02-11T21:45:58.557349 #303] INFO -- : Writing /tmp/build_f6d49c25/public/assets/jumbotron-4e5a1586b8afb6f5e26722d19ec0227e803b1d6618993041f7e1411fffc5bb69.jpg
Compiling...
Compilation failed:
ModuleNotFoundError: Module not found: Error: Can't resolve '@popperjs/core' in '/tmp/build_f6d49c25/node_modules/bootstrap/dist/js'
at /tmp/build_f6d49c25/node_modules/webpack/lib/Compilation.js:925:10
at /tmp/build_f6d49c25/node_modules/webpack/lib/NormalModuleFactory.js:401:22
at /tmp/build_f6d49c25/node_modules/webpack/lib/NormalModuleFactory.js:130:21
at /tmp/build_f6d49c25/node_modules/webpack/lib/NormalModuleFactory.js:224:22
at /tmp/build_f6d49c25/node_modules/neo-async/async.js:2830:7
at /tmp/build_f6d49c25/node_modules/neo-async/async.js:6877:13
at /tmp/build_f6d49c25/node_modules/webpack/lib/NormalModuleFactory.js:214:25
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/Resolver.js:213:14
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/Resolver.js:285:5
at eval (eval at create (/tmp/build_f6d49c25/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:44:7
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/Resolver.js:285:5
at eval (eval at create (/tmp/build_f6d49c25/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/Resolver.js:285:5
at eval (eval at create (/tmp/build_f6d49c25/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:25:1)
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:67:43
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/Resolver.js:285:5
at eval (eval at create (/tmp/build_f6d49c25/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:41:1)
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/ModuleKindPlugin.js:30:40
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/Resolver.js:285:5
at eval (eval at create (/tmp/build_f6d49c25/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/Resolver.js:285:5
at eval (eval at create (/tmp/build_f6d49c25/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:14:1)
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/forEachBail.js:30:14
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/Resolver.js:285:5
at eval (eval at create (/tmp/build_f6d49c25/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:44:7
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/Resolver.js:285:5
at eval (eval at create (/tmp/build_f6d49c25/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/Resolver.js:285:5
at eval (eval at create (/tmp/build_f6d49c25/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:25:1)
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:67:43
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/Resolver.js:285:5
at eval (eval at create (/tmp/build_f6d49c25/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:14:1)
at /tmp/build_f6d49c25/node_modules/enhanced-resolve/lib/RootPlugin.js:37:38
at _next42 (eval at create (/tmp/build_f6d49c25/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
resolve '@popperjs/core' in '/tmp/build_f6d49c25/node_modules/bootstrap/dist/js'
Parsed request is a module
using description file: /tmp/build_f6d49c25/node_modules/bootstrap/package.json (relative path: ./dist/js)
Field 'browser' doesn't contain a valid alias configuration
resolve as module
looking for modules in /tmp/build_f6d49c25/app/javascript
using description file: /tmp/build_f6d49c25/package.json (relative path: ./app/javascript)
Field 'browser' doesn't contain a valid alias configuration
using description file: /tmp/build_f6d49c25/package.json (relative path: ./app/javascript/@popperjs/core)
no extension
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core doesn't exist
.mjs
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core.mjs doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core.js doesn't exist
.sass
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core.sass doesn't exist
.scss
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core.scss doesn't exist
.css
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core.css doesn't exist
.module.sass
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core.module.sass doesn't exist
.module.scss
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core.module.scss doesn't exist
.module.css
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core.module.css doesn't exist
.png
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core.png doesn't exist
.svg
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core.svg doesn't exist
.gif
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core.gif doesn't exist
.jpeg
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core.jpeg doesn't exist
.jpg
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/app/javascript/@popperjs/core.jpg doesn't exist
as directory
/tmp/build_f6d49c25/app/javascript/@popperjs/core doesn't exist
/tmp/build_f6d49c25/node_modules/bootstrap/dist/js/node_modules doesn't exist or is not a directory
/tmp/build_f6d49c25/node_modules/bootstrap/dist/node_modules doesn't exist or is not a directory
/tmp/build_f6d49c25/node_modules/bootstrap/node_modules doesn't exist or is not a directory
/tmp/build_f6d49c25/node_modules/node_modules doesn't exist or is not a directory
/tmp/node_modules doesn't exist or is not a directory
/node_modules doesn't exist or is not a directory
looking for modules in /tmp/build_f6d49c25/node_modules
using description file: /tmp/build_f6d49c25/package.json (relative path: ./node_modules)
Field 'browser' doesn't contain a valid alias configuration
using description file: /tmp/build_f6d49c25/package.json (relative path: ./node_modules/@popperjs/core)
no extension
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core doesn't exist
.mjs
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core.mjs doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core.js doesn't exist
.sass
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core.sass doesn't exist
.scss
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core.scss doesn't exist
.css
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core.css doesn't exist
.module.sass
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core.module.sass doesn't exist
.module.scss
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core.module.scss doesn't exist
.module.css
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core.module.css doesn't exist
.png
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core.png doesn't exist
.svg
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core.svg doesn't exist
.gif
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core.gif doesn't exist
.jpeg
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core.jpeg doesn't exist
.jpg
Field 'browser' doesn't contain a valid alias configuration
/tmp/build_f6d49c25/node_modules/@popperjs/core.jpg doesn't exist
as directory
/tmp/build_f6d49c25/node_modules/@popperjs/core doesn't exist
!
! Precompiling assets failed.
!
! Push rejected, failed to compile Ruby app.
! Push failed
I've found a solution to the same problem I've been having. It seems that the code
yarn add bootstrap jquery popper.js
is outdated and is used for Bootstrap 4.
I myself have been using/developing for Bootstrap 5 therefor I had to remove the packages from above using
yarn remove bootstrap jquery popper.js
And instead run, for Bootstrap 5
yarn add bootstrap@next jquery @popperjs/core
At the time of this answer, I've found a solution to the same problem I've been having. I'd suggest you just
yarn remove popper.js
and then install @popperjs/core
yarn add @popperjs/core
and that is
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With