Rails 7, Bootstrap 5.2. Dropdown component doesn't work

Question

I try to add dropdown navbar component from bootstrap in my application. But it doesn't work. It is the item navbar:

 <li class="nav-item dropdown">
          <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
            <%= t('submit.language') %>
          </a>
          <ul class="dropdown-menu">
            <li><%= link_to 'English', controller: controller_name, action: action_name, locale: :en, class: "dropdown-item" %></li>
            <li><%= link_to 'Spanish', controller: controller_name, action: action_name, locale: :es, class: "dropdown-item" %></li>
          </ul>
        </li>

package.json:

{
  "dependencies": {
    "@hotwired/stimulus": "^3.1.1",
    "@hotwired/turbo-rails": "^7.2.4",
    "@popperjs/core": "^2.11.6",
    "bootstrap": "^5.2.3",
    "bootstrap-icons": "^1.10.2",
    "esbuild": "^0.15.15",
    "sass": "^1.56.1"
  },
  "scripts": {
    "build:css": "sass ./app/assets/stylesheets/application.bootstrap.scss:./app/assets/builds/application.css --no-source-map --load-path=node_modules",
    "build": "esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds --public-path=assets"
  }
}

application.js

import "@hotwired/turbo-rails";
import "./controllers";
import * as bootstrap from "bootstrap";

application.bootstrap.scss:

@import 'bootstrap/scss/bootstrap';
@import 'bootstrap-icons/font/bootstrap-icons';

manifest.js

//= link_tree ../images
//= link_tree ../../javascript .js
//= link_tree ../../../vendor/javascript .js
//= link_tree ../builds
//= link custom.css

and application.html.erb:

<%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
<%= stylesheet_link_tag "custom", "data-turbo-track": "reload" %>
<%= javascript_include_tag "application", "data-turbo-track": "reload", defer: true %>

I have node_modules directory where I found @popperjs/core with a version like in package and yarn.lock - 2.11.6. I couldn't find where the error is. Please, help me!

Rails 7, Bootstrap 5.2. Dropdown component doesn't work

0 Answers0