Bootstrap Navbar toggle dropdown not working

Ok so I just deployed my website successfully and now he bootstrap toggle button is not working. I have followed the steps in this post:https://laracasts.com/discuss/channels/guides/bootstrap-4-dropdown-menu-is-not-working

And made sure that my Bootstrap markup is correct by copying and pasting direct from bootstrap docs.

I also added in the following to my webpack.mix.js file

mix.autoload({
    'jquery': ['$', 'window.jQuery', "jQuery", "window.$", "jquery", "window.jquery"],
    'popper.js/dist/umd/popper.js': ['Popper', 'window.Popper']
});

Any ideas/suggestions?

bobbybouwmann

7 years ago

Level 88

What exactly is not working? Just the menu? Do you get any error messages in the developer console?

Here is a working example: https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_navbar_dropdown&stacked=h

swindleNswoon

7 years ago

Level 1

So I am referencing Bootstrap directly through the Laravel framework via Laravel Mix, so the above example won't work as my app layout file doesn't look like that. Bootstrap itself is working fine except for the dropdown menu (hamburger icon) on small screens.

swindleNswoon

7 years ago

Level 1

Also the above mix.autoload is no good anymore, causes npm to fail

swindleNswoon

7 years ago

Level 1

Fixed, not sure how or why this worked but this worked for me: https://stackoverflow.com/questions/49487478/bootstrap-not-working-in-laravel-5-6

rerool

5 years ago

Level 1

<!-- CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
<!-- jQuery and JS bundle w/ Popper.js -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>

Please or to participate in this conversation.