bootstrap 5 не выбрасывает события show.bs.dropdown и hide.bs.dropdown

Делаю сайт на связке webpack4+bootstrap5 Необходимо добавить анимацию в dropdown в меню. В интернете советуют делать так:

        $('.dropdown').on('show.bs.dropdown', function() {
           $(this).find('.dropdown-menu').first().stop(true, true).slideDown();
        });

        $('.dropdown').on('hide.bs.dropdown', function() {
          $(this).find('.dropdown-menu').first().stop(true, true).slideUp();
        });

Но почему-то события не выбрасываются. HTML код такой:

    . . .
<li class="nav-item dropdown">
  <a class="nav-link menu_level_1 dropdown-toggle" data-bs-toggle="dropdown" href=""
    id="nav_link_3" role="button" aria-expanded="false">
    Каталог
  </a>
  <ul class="dropdown-menu dropdown-menu-dark" aria-labelledby="nav_link_3">
    . . .
  </ul>
</li>
. . .

Может, кто подскажет, что я делаю не так?