Bootstrap 4: Uncaught ReferenceError: Popper is not defined
Solution 1:
Since our Bootstrap beta 2 release, we added two new dist files : bootstrap.bundle.js and bootstrap.bundle.min.js which contain Popper.js inside
Plus use this link to find the latest release of Popper.js : https://cdnjs.com/libraries/popper.js because the above linked release (1.8.2) is very old, latest is 1.12.9
BTW you should choose the UMD release of Popper.js because it's the one used by Bootstrap
Solution 2:
Use bootstrap.bundle.js that already has popper.js NPM path 'bootstrap/dist/js/bootstrap.bundle.js'.
Solution 3:
For those struggling with this issue on Webpack: In your entry file,
import 'bootstrap' does give the error. You need to remove that and replace it with import 'bootstrap/dist/js/bootstrap.bundle.js'
This is sufficient and you don't need to import Popper separately. That applies for bootstrap 4.0.0.beta2
Solution 4:
In my case it turned out that the popper.js script should be called before bootstrap.js.
<script src="https://../popper.js/1.12.3/umd/popper.min.js"></script>
<script src="https://../bootstrap/4.0.0-beta.2/js/bootstrap.min.js"></script>
Solution 5:
I had the same issue and have been playing around with it for half a day over a simple carousel. Safari on Mac didn't give feedback properly in that there is a priority on libraries:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.6/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"></script>
Reviewing the error I ran across "You need JQ before BS for this to work", so I tried it, also putting Popper before BS.
So I have all of these in my <head> and boom it worked.