Ich habe versucht, Bootstrap 4 zu installieren, und folgende Links eingefügt
<script src="libs/jquery/dist/jquery.min.js"></script>
<script src="libs/tether/dist/js/tether.min.js" ></script>
<script src="libs/popper.js/dist/popper.js"></script>
<script src="libs/bootstrap/dist/js/bootstrap.min.js" ></script>
Der folgende Fehler tritt jedoch auf:
Nicht erfasste SyntaxError: Unerwarteter Token-Export
Irgendwelche Ideen, wie man das Problem behebt?
javascript
twitter-bootstrap
bootstrap-4
popper.js
Павел Шиляев
quelle
quelle
Antworten:
Ich habe das gleiche Problem festgestellt, wenn ich popper.js aus dem CDN-Netzwerk wie verwende
cdnjs
.Wenn Sie den Quellcode von
Bootstrap 4
Beispielen wie zum Beispiel Navbar beachten , können Sie sehen, dass dieserpopper.min.js
geladen wird von:Ich habe das in mein Projekt aufgenommen und der Fehler ist weg. Sie können den Quellcode von herunterladen
und in Ihr Projekt als lokale Datei aufnehmen und es sollte funktionieren.
quelle
popper.js
Habe das auch bekommen und herausgefunden, warum es wirklich passiert. Für den Fall, dass andere hier durchkommen:
Überprüfen Sie die readme.md "Verwendung". Die lib ist in drei Versionen für drei verschiedene Modullader verfügbar. Kurz gesagt: Wenn Sie es mit dem
<script>
Tag laden, müssen Sie die UMD- Version verwenden. Sie finden es in/dist/umd
. Der Standardwert (in/dist
) ist der ESNext (ECMA-Script), der nicht mit demscript
Tag geladen werden kann .quelle
Bootstrap 4 erfordert die UMD-Version von
popper.js
und stellen Sie sicher, dass die Reihenfolge wie folgt lautet:quelle
Sie können auch bootstrap.bundle.min.js hinzufügen und popper.js in Ihrem HTML-Code entfernen.
Gebündelte (
bootstrap.bundle.js
und minimiertebootstrap.bundle.min.js
) JS-Dateien enthalten [Popper] ( https://popper.js.org/ ), jedoch nicht jQuery .quelle
bootstrap.bundle.min.js
enthaltenpopperjs
Zeile 96 in README
Dist Ziele
Popper.js wird derzeit mit drei Zielen ausgeliefert: UMD, ESM und ESNext.
dist/
, kann mit Webpack verwendet werden undbabel-preset-env
;Stellen Sie sicher, dass Sie das richtige für Ihre Bedürfnisse verwenden. Wenn Sie es mit einem
<script>
Tag importieren möchten , verwenden Sie UMD.quelle
Sie haben folgenden Code in Bundle Config bundles.Add (neues ScriptBundle ("~ / bundles / jquery"). Include ("~ / Scripts / jquery- {version} .js"));
folgenden Code in Layout-HTML
Das hat bei mir funktioniert
quelle