15 Volts
15 Volts

Reputation: 2077

Error: Cannot find module 'bootstrap-sprockets'

Although running bootstrap with rails is working fine, the JS functionality isn't working for me. For example, I can't collapse navbar, but I can run $() in my browser console.

My /app/javascript/packs/application.js looks like this:

// This file is automatically compiled by Webpack, along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant structure within app/javascript and only use these pack files to reference
// that code so it'll be compiled.

require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
require("jquery")
require('bootstrap-sprockets')
require('popper.js')
require('turbolinks')

// As instructed in https://github.com/twbs/bootstrap-rubygem#a-ruby-on-rails 
//= require bootstrap-sprockets
// But the above is not working

My /app/assets/stylesheets/application.scss looks like this:

@import "bootstrap" ;

body {
    margin: 0 ;
}

In my routes.rb, I have root to: 'pages#home'. The home.html.erb looks like this:

<div class="cover-container d-flex w-100 h-100 p-3 mx-auto flex-column">
  <main role="main" class="inner cover">
    <h1 class="cover-heading">Cover your page.</h1>
    <p class="lead">Cover is a one-page template for building simple and beautiful home pages. Download, edit the text, and add your own fullscreen background photo to make it your own.</p>
    <p class="lead">
      <a href="#" class="btn btn-lg btn-secondary">Learn more</a>
    </p>
  </main>

  <footer class="mastfoot mt-auto">
    <div class="inner">
      <p>Cover template for <a href="https://getbootstrap.com/">Bootstrap</a>, by <a href="https://twitter.com/mdo">@mdo</a>.</p>
    </div>
  </footer>
</div>

When I run the server, and visit the home page, an error is showing up on the browser's console:

Error: Cannot find module 'bootstrap-sprockets'

My gem file has these entries for jquery, bootstap:

gem 'jquery-rails', '~> 4.3', '>= 4.3.5'
gem "bootstrap", "~> 4.4"
gem 'bootstrap-sass'

I can't use features like navbar collapse in bootstrap. What's wrong?

Upvotes: 1

Views: 770

Answers (1)

Joserra D&#237;az
Joserra D&#237;az

Reputation: 21

I had same problems with collapse not working, and latest version of jQuery and bootstrap. Had to change to: "bootstrap": "^4.4.1", "jquery": "3.4.1"

But this was with rails 6.0.1, so using ujs. Check those versions.

Upvotes: 2

Related Questions