web-dev-qa-db-ja.com

ブートストラップ4：不明なReferenceError：Popperが定義されていません

NodeとGulpを使ってBootstrap 4をインストールしましたが、アプリケーションを実行すると以下のエラーが表示されます。

不明なReferenceError：Popperは定義されていない

私はこれまでBootstrapグリッドシステムを使用してきただけで、Bootstrap JSを必要とするものは何も使用していません。 Bootstrapに何かが足りないか、正しくインストールされていないようです（正直なところ、おそらく私です）。

javascriptjquerybootstrap-4
51
Web Develop Wolf

Bootstrap Beta 2リリース以降、2つの新しいdistファイルが追加されました。内部にbootstrap.bundle.jsを含むbootstrap.bundle.min.jsとPopper.jsです。

このリンクを使ってPopper.jsの最新リリースを見つけてください。 https://cdnjs.com/libraries/popper.js （1.8.2）は非常に古く、最新のものは1.12.9です

ところで、Popper.jsのUMDリリースはBootstrapで使用されるものであるため、選択する必要があります。

49
Johann-S

既にpopper.jsNPMパスを持つbootstrap.bundle.jsを使用 'bootstrap/dist/js/bootstrap.bundle.js'。

21
Anuj Dhanju

Webpackでこの問題に苦しんでいる人のために：あなたのエントリファイルで、
import 'bootstrap'はエラーになります。あなたはそれを削除し、import 'bootstrap/dist/js/bootstrap.bundle.js'と置き換える必要があります。

これで十分であり、Popperを別にインポートする必要はありません。それはブートストラップ4.0.0.beta2に適用されます

15
Euripides Georgantzos

私の場合は、popper.jsスクリプトが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>
12
Abdelsalam Shahlol

私は同じ問題を抱えていて、単純なカルーセルの上で半日それで遊んでいました。 Mac上のSafariは、ライブラリを優先するという点で、適切にフィードバックをしていませんでした。

    <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>

「これを機能させるには、BSの前にJQが必要です」というエラーに遭遇したので、私はそれを試してみました。また、BSの前にPopperを付けました。

だから私は私の<head>の中にこれらすべてを持っていてそれがうまくいったブームをしています。

3
Rich_F

このページの1-コピーコード： https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js

2 - 新しいファイルに貼り付け、この名前で保存する（popper.min.js）

3 - ブートストラップスクリプトの前にHTMLにスクリプトを追加します。

<script src="popper.min.js"></script>
<script src="bootstrap.js"></script>
1
G. Hamza

私も同じでした。私はRailsを使っていて、私は https://github.com/twbs/bootstrap-rubygem からブートストラップ4 gemのインストールに従った。このように、まずapplication.jsでpopperの要件を設定します。

//= require popper
//= require jquery3
//= require jquery_ujs
//= require bootstrap-sprockets
//= require bootstrap
1
Maxime Boué