# Externe Javascript Bibliothek / externes Javascript einbinden
**URL:** https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564
**Category:** Shopware 6 (German)
**Tags:** programming, themes--design
**Created:** [24. Februar 2025 um 09:49 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564 "2025-02-24T09:49:27Z")
**Posts on this page:** 13
**Page:** 1
### Author:  [@Thorsten76](https://forum.shopware.com/u/Thorsten76)
#### Post date: [24. Februar 2025 um 09:49 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564/1 "2025-02-24T09:49:27Z")
Hallo,
ich bin gerade dabei meinen Shop von Shopware 6.5 auf Shopware 6.6.x upzudaten.
Mein eigenes Theme wird geladen und die eigenen Scripte funktionieren soweit.
Das einziges Problem ist, das ich ein externes Javascript nicht eingebunden bekomme bzw. nicht laden kann. Es handelt sich dabei um einen Videoplayer. [lite-youtube-embed/src/lite-yt-embed.js at master · paulirish/lite-youtube-embed · GitHub](https://github.com/paulirish/lite-youtube-embed/blob/master/src/lite-yt-embed.js)
In SW 6.5 habe ich diesen einfach in der Theme.json unter scripts hinterlegt und es wurde verwendet wenn ich das entsprechende Tag einbinde. Aber in SW 6.6 funktioniert das nicht mehr. Den Pfad zum js hab ich angepasst, es wird aber nicht geladen.
Nach meinem Verständnis vom neuen System, sollte es ja trotzdem möglich sein eine externes Script einzubinden, oder sehe ich das falsch? Ich bin die Doku schon mehrfach durchgegangen, kann aber keinen Fehler ausmachen. Meine eigenen Scripte werden geladen. Diese sind auch in der main.js eingebunden. Hat jemand eine Idee?
Danke schonmal.
Gruß
Thorsten
---
### Author:  [@DannyBO](https://forum.shopware.com/u/DannyBO)
#### Post date: [24. Februar 2025 um 10:57 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564/2 "2025-02-24T10:57:40Z")
wir benutzen das dafür
> **[Custom JavaScript/CSS Manager für Shopware 6](https://store.shopware.com/de/dne5719820551438m12/custom-javascript-css-manager-fuer-shopware-6.html)**
>
> Fügt dem Backend einen Container Manager für JavaScript/SCSS hinzu. Schnell und einfach eigenes CSS und JavaScript schreiben und in den Storefront kompilieren.
---
### Author:  [@R4M](https://forum.shopware.com/u/R4M)
#### Post date: [24. Februar 2025 um 11:55 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564/3 "2025-02-24T11:55:08Z")
> [@Thorsten76](#):
>
> ein externes Javascript
Ein zusätzliches Script zum Einbinden von YouTube-Videos? Wieso? 🤔
Man muss eigentlich nur „iframe“ bei „html\_sanitizer“ erlauben (z-shopware.yaml), dann kann ganz normal den Code von YouTube benutzt werden. Da braucht man kein extra Javascript.
---
### Author:  [@Thorsten76](https://forum.shopware.com/u/Thorsten76)
#### Post date: [24. Februar 2025 um 13:31 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564/4 "2025-02-24T13:31:45Z")
Danke für die Antwort.
Das Script lädt die Youtube Videos schneller, daher nehmen wir das, lief bisher auch sehr gut. Aber unabhängig von der Funktion des Scripts sollte es doch möglich sein, ein externes Javascript einzubinden. Oder habe ich da einen Denkfehler?
---
### Author:  [@R4M](https://forum.shopware.com/u/R4M)
#### Post date: [25. Februar 2025 um 08:48 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564/5 "2025-02-25T08:48:23Z")
> [@Thorsten76](#):
>
> Das Script lädt die Youtube Videos schneller
Echt? Weil bei der Demo das Video einfach per iFRame eingebunden wird. Also die selbe Methode wie beim Einbetten von YouTube.
Ansonsten das JavaScript mittels Plugin (wurde ja schon erwähnt) oder wenn du ein eigenes Themes hast, dann hier. Im Standard Backend gibt es dafür keine Funktion.
---
### Author:  [@Thorsten76](https://forum.shopware.com/u/Thorsten76)
#### Post date: [25. Februar 2025 um 09:28 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564/6 "2025-02-25T09:28:05Z")
Ich hab ein eigenes Theme, würde daher auf ein externes Plugin verzichten wollen.
Das Problem ist, das ich das externe JS Script nicht geladen bekomme. Mein eigenes JS, um das Theme zu erweitern wird auch geladen und funktioniert. Das wurde aber auch extra für SW geschrieben. Aber externe Scripte, wie beispielsweise das Youtube Script, klappen leider nicht.
Ich verstehe leider nicht was ich in Shopware 6.6 machen muss, um das Laden zu können. In 6.5 ging es problemlos, da stand es nur in der Theme.json unter dem Script Tag.
Muss ich das Script jetzt als Plugin umarbeiten und kann es nicht mehr einbinden wie es original ist?
In der main.js hab ich es nicht eingetragen sondern in der theme.json Testweise in die main.js eingetragen habe ich es natürlich auch schon, aber nichts hilft. Das Script wird nicht eingelesen.
Wenn du hier eine Idee hättest, wäre ich dir sehr dankbar.
---
### Author:  [@chamaw](https://forum.shopware.com/u/chamaw)
#### Post date: [25. Februar 2025 um 10:09 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564/7 "2025-02-25T10:09:42Z")
Das ext. Skript nutzt vermutlich auch selber wieder Abhängigkeiten, die dann mit Shopware kolidieren. Insbesondere wenn hier dann sogar unterschiedliche Version genutzt werden.
Für einen ersten Start-Punkt würde ich das „hart“ im Theme in den HTML Header einbauen.
---
### Author:  [@R4M](https://forum.shopware.com/u/R4M)
#### Post date: [25. Februar 2025 um 10:09 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564/8 "2025-02-25T10:09:55Z")
> [@Thorsten76](#):
>
> theme.json … main.js
Also externe JavaScripte habe ICH weder in die eine noch in die andere von dir erwähnte Datei eingetragen. Ich weiß auch gar nicht ob das überhaupt möglich ist.
Grundsätzlich gehört eigenes JS in die \.js - also gemäß den Vorgaben ab SW 6.6 - zwischen SW 6.5 und SW 6.6 gibt es Änderungen bei der Struktur! Steht alles in der Doku.
Externe JS (also Verlinkungen mit https etc.) habe ich allerdings in die „base.html.twig“ gepackt.
```auto
{% sw_extends '@Storefront/storefront/base.html.twig' %}
{% block base_html %}
{{ parent() }}
{% endblock %}
```
Da gibt es sicherlich auch noch andere Blöcke 🙂
---
### Author:  [@Thorsten76](https://forum.shopware.com/u/Thorsten76)
#### Post date: [25. Februar 2025 um 10:55 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564/9 "2025-02-25T10:55:57Z")
Danke für die Antworten. 🙂
In Shopware 6.5 war es in der theme.json unter den Scripts verlinkt und konnte mit einem Tag angesprochen werden, genau so wie Shopware das eigentlich mit dem js aus dem Theme macht. Es entspricht halt von Haus aus nicht der Shopwarestruktur, aber hat funktioniert.
Wenn das jetzt nicht mehr geht, werde ich das so akzeptieren und es so machen wie ihr gesagt habt und den Pfad zum script einfach in den Block schreiben. Danke euch!
---
### Author:  [@Frank\_2812](https://forum.shopware.com/u/Frank_2812)
#### Post date: [25. Februar 2025 um 13:02 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564/10 "2025-02-25T13:02:02Z")
Ich hatte das Problem auch kürzlich, bei einem Update auf Version 6.6.x:
Ursache: Shopware hat die Verzeichnisstrukturen für die Einbindung von JavaScript verändert.
```auto
Before:
└── custom/apps/
└── ExampleApp/src/Resources/app/storefront/dist/storefront/js/
└── example-app.js
After:
└── custom/apps/
└── ExampleApp/src/Resources/app/storefront/dist/storefront/js/
├── example-app.js <-- OLD: Please remove
└── example-app/ <-- NEW: Please include everything in this folder in the release
├── example-app.js
├── async-example-1.js
└── async-example-2.js
```
Schau mal hier: [shopware/UPGRADE-6.6.md at trunk · shopware/shopware · GitHub](https://github.com/shopware/shopware/blob/trunk/UPGRADE-6.6.md#general-storefront-breaking-changes)
Die neue Struktur wird nach einem `bin/build-storefront.sh` aufgebaut.
Die Scripte, müssen in das neue dist-Verzeichnis hinein und in der theme.json referenziert werden. Sie werden nicht berücksichtigt, wenn sie im src-Verzeichnis liegen.
Der sauberste Weg ist aber die Erstellung eines eigenen JavaScript-Plugins. Wie das geht, kannst Du hier lesen: [Add Custom Javascript | Shopware Documentation](https://developer.shopware.com/docs/guides/plugins/plugins/storefront/add-custom-javascript.html)
Wenn es so korrekt implementiert ist, landet der minimierte JS-Code nach einem `bin/build-storefront.sh` im neuen dist-Verzeichnis. Das Ganze funktioniert übrigens auch asynchron.
---
### Author:  [@Thorsten76](https://forum.shopware.com/u/Thorsten76)
#### Post date: [26. Februar 2025 um 08:11 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564/11 "2025-02-26T08:11:15Z")
Danke für die Tipps, ich werde das Script zu einem JS Plugin umbauen. Es hat mich nur interessiert was ich falsch mache.
Die externe Datei ins dist Verzeichnis zu legen, geht leider nicht, da es dann beim kompilieren automatisch gelöscht und nicht eingebunden wird, auch nicht wenn es in der theme.js eingetragen wird.
Falls es noch jemand braucht, mit einem **require(‚./script/lite-yt-embed‘);** am Anfang der main.js klappt es so wie es soll. Ich bau’s aber zum Plugin um, damit es sauberer ist.
Danke euch.
---
### Author:  [@Frank\_2812](https://forum.shopware.com/u/Frank_2812)
#### Post date: [26. Februar 2025 um 10:23 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564/12 "2025-02-26T10:23:16Z")
Hi @Thorsten76,
ein JS-Plugin zu machen, ist der richtige Weg. Ich habe auch eine Zeit an dem Thema zugebracht, aber wenn man das einmal verstanden hat, ist es eigentlich gar nicht so schwer.
Das die zusätzlichen JS-Scripte im dist-Verzeichnis gelöscht werden, sobald ein `bin/build-storefront.sh` ausgeführt wird, stimmt natürlich. Ich hatte mir deshalb immer noch eine Kopie im src-Verzeichnis abgelegt. Bei mir funktionierte die Einbindung im dist-Verzeichnis aber trotzdem. Also wenn man die zusätzlichen Scripte, im neu entstandenen Unterverzeichnis, welches so wie das Theme heißt, ablegt und über die theme.json einbindet.
---
### Author:  [@system](https://forum.shopware.com/u/system)
#### Post date: [28. März 2025 um 10:24 UTC](https://forum.shopware.com/t/externe-javascript-bibliothek-externes-javascript-einbinden/106564/13 "2025-03-28T10:24:13Z")
Dieses Thema wurde automatisch 30 Tage nach der letzten Antwort geschlossen. Es sind keine neuen Antworten mehr erlaubt.