# Javascript Datei einbinden

**URL:** <https://forum.shopware.com/t/javascript-datei-einbinden/55970>\
**Category:** Programmierung\
**Created:** [24. Oktober 2018 um 19:32 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970 "2018-10-24T19:32:30Z")\
**Posts on this page:** 17\
**Page:** 1

<div class="post-metadata">

**Author:** ![10083349](https://avatars.discourse-cdn.com/v4/letter/1/bc79bd/32.png) [@10083349](https://forum.shopware.com/u/10083349)\
**Post date:** [24. Oktober 2018 um 19:32 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/1 "2018-10-24T19:32:30Z")

</div>

Liebes Forum,

nach einigen Tutorials probiere ich mein erstes Javascript aus.

In themes\Frontend\MyTheme\Theme.php habe ich folgendes ergänzt:

```
**protected**  **$javascript** = **array** ( **'src/js/** mytheme **.js'** );

```

Und das Script in themes\Frontend\MyTheme\_public\scr\js\mytheme.js:

```
 ;( **function** ($, window) { **"use strict"** ; console.log( **'hello world'** ); })(jQuery, window);

```

In der Konsole sehe ich aber nichts. Woran könnte es liegen?

Vielen Dank.

---

<div class="post-metadata">

**Author:** ![sschreier](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/sschreier/32/23296_2.png) [@sschreier](https://forum.shopware.com/u/sschreier)\
**Post date:** [24. Oktober 2018 um 19:37 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/2 "2018-10-24T19:37:23Z")

</div>

Hallo,

wahrscheinlich am Rechtschreibfehler beim Pfad (scr) oder weil der Pfad eigentlich so lauten müsste: themes\Frontend\MyTheme\frontend\_public\src\js\mytheme.js .

Kompletten Shop Cache, also inklusive Theme- und Backend-Cache, geleert?

Grüße

Sebastian

---

<div class="post-metadata">

**Author:** ![10083349](https://avatars.discourse-cdn.com/v4/letter/1/bc79bd/32.png) [@10083349](https://forum.shopware.com/u/10083349)\
**Post date:** [24. Oktober 2018 um 19:40 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/3 "2018-10-24T19:40:21Z")

</div>

Ja, das Theme neu kompiliert, dann “Einstellungen” -\> “Caches / Performance” -\> “shop cache leeren”. Gibt es da noch etwas?

Du meinst, dass das prinzipiell so funktionieren müsste?

---

<div class="post-metadata">

**Author:** ![10083349](https://avatars.discourse-cdn.com/v4/letter/1/bc79bd/32.png) [@10083349](https://forum.shopware.com/u/10083349)\
**Post date:** [24. Oktober 2018 um 19:41 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/4 "2018-10-24T19:41:27Z")

</div>

Der Pfad ist richtig, ich habe es nur falsch abgetippt.

---

<div class="post-metadata">

**Author:** ![sschreier](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/sschreier/32/23296_2.png) [@sschreier](https://forum.shopware.com/u/sschreier)\
**Post date:** [24. Oktober 2018 um 19:46 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/5 "2018-10-24T19:46:58Z")

</div>

Hallo,

ich meinte nicht den schnellen Cache leeren, sondern den kompletten (“Einstellungen” -\> “Cache / Perfomance” -\> “Cache / Performance”), also auch inklusive Theme-Cache (am besten einfach bei “Alle auswählen” und “Leeren”&nbsp;anklicken)&nbsp;und Theme kompilieren.

Einbindung siehe die offizielle Shopware Dokumentation zu dem Thema:&nbsp;[Using CSS and JavaScript in themes](https://developers.shopware.com/designers-guide/css-and-js-files-usage/) . Funktioniert auch so korrekt.

Grüße

Sebastian

---

<div class="post-metadata">

**Author:** ![10083349](https://avatars.discourse-cdn.com/v4/letter/1/bc79bd/32.png) [@10083349](https://forum.shopware.com/u/10083349)\
**Post date:** [24. Oktober 2018 um 20:17 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/6 "2018-10-24T20:17:26Z")

</div>

Danke, - alle Häkchen gesetzt, Cache geleert, will aber immr noch nicht. Habe es im Grunde so, wie in der Doku beschrieben, gemacht.

Hast du noch eine Idee? Und das Script selbst?

Gruß

Mike

&nbsp;

---

<div class="post-metadata">

**Author:** ![christiantrade](https://avatars.discourse-cdn.com/v4/letter/c/c4cdca/32.png) [@christiantrade](https://forum.shopware.com/u/christiantrade)\
**Post date:** [25. Oktober 2018 um 02:34 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/7 "2018-10-25T02:34:53Z")

</div>

Hast du das Theme neu geladen, anstatt nur direkt kompiliert?

Im Theme Manager oben einmal auf „Themes neu laden“ klicken, dann nochmal das Theme zuweisen.

Davon ab ist es in der Entwicklung sinnvoll hier mit dem Grunt Task zu arbeiten, um sich das klicken im Backend zu sparen -\>&nbsp;[https://developers.shopware.com/designers-guide/using-grunt/](https://developers.shopware.com/designers-guide/using-grunt/)

---

<div class="post-metadata">

**Author:** ![10083349](https://avatars.discourse-cdn.com/v4/letter/1/bc79bd/32.png) [@10083349](https://forum.shopware.com/u/10083349)\
**Post date:** [25. Oktober 2018 um 14:51 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/8 "2018-10-25T14:51:26Z")

</div>

Mit Grunt oder der Konsole komme ich nicht weiter. Ich habe auch versucht, die Konsole irgendwie zum Laufen zu bringen. Es geht nicht. Ich vermute, dass es unter Windows nicht funktioniert. Alle Befehle, die ich dort eintippe, funktionieren nicht.

Auch Grunt scheint nicht für Windows gemacht zu sein. Jedenfalls sind die Installationen nur für Linux und Mac erklärt.

Habe ich recht?

---

<div class="post-metadata">

**Author:** ![10083349](https://avatars.discourse-cdn.com/v4/letter/1/bc79bd/32.png) [@10083349](https://forum.shopware.com/u/10083349)\
**Post date:** [25. Oktober 2018 um 15:09 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/9 "2018-10-25T15:09:34Z")

</div>

Hm, ich habe den Rechner neu gestartet. Wieder nichts.

---

<div class="post-metadata">

**Author:** ![langnickel](https://avatars.discourse-cdn.com/v4/letter/l/3ec8ea/32.png) [@langnickel](https://forum.shopware.com/u/langnickel)\
**Post date:** [25. Oktober 2018 um 15:52 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/10 "2018-10-25T15:52:50Z")

</div>

@10083349&nbsp;Versuche mal eine andere Konsole&nbsp;(also nicht die Standard Console von Windows) z.B. Cmder ([GitHub - cmderdev/cmder: Lovely console emulator package for Windows](https://github.com/cmderdev/cmder)) oder Git for Windows mit&nbsp;Bash ([https://git-scm.com](https://git-scm.com)) oder die Shell die bei node.js dabei ist (glaube grunt brauch nodejs). Alternativ einen Editor wie Visual Studio Code, der liefert so weit ich weiß node.js für Windows vorkonfiguriert aus.

---

<div class="post-metadata">

**Author:** ![mastox](https://avatars.discourse-cdn.com/v4/letter/m/48db29/32.png) [@mastox](https://forum.shopware.com/u/mastox)\
**Post date:** [25. Oktober 2018 um 19:55 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/11 "2018-10-25T19:55:51Z")

</div>

> [@10083349 schrieb:](https://forum.shopware.com/profile/29475/10083349 "10083349")
> 
> Und das Script in themes\Frontend\MyTheme\_public\scr\js\mytheme.js:

Die js Datei liegt glaub ich im falschen Ordner die muss in&nbsp;&nbsp;&nbsp; themes\Frontend\MyTheme\ **frontend** \_public\src\js\mytheme.js

> **[Using CSS and JavaScript in themes](https://developers.shopware.com/designers-guide/css-and-js-files-usage/)**
>
> Using CSS and JavaScript in themes

---

<div class="post-metadata">

**Author:** ![10083349](https://avatars.discourse-cdn.com/v4/letter/1/bc79bd/32.png) [@10083349](https://forum.shopware.com/u/10083349)\
**Post date:** [25. Oktober 2018 um 20:22 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/12 "2018-10-25T20:22:33Z")

</div>

mastox - du hast recht. Es geht!

Vielen, vielen Dank.

Keine Ahnung, wieso der Pfad so schräg angehängt war.

---

<div class="post-metadata">

**Author:** ![10083349](https://avatars.discourse-cdn.com/v4/letter/1/bc79bd/32.png) [@10083349](https://forum.shopware.com/u/10083349)\
**Post date:** [25. Oktober 2018 um 20:43 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/13 "2018-10-25T20:43:25Z")

</div>

> [@langnickel schrieb:](https://forum.shopware.com/profile/26214/langnickel "langnickel")

> @10083349&nbsp;Versuche mal eine andere Konsole&nbsp;(also nicht die Standard Console von Windows) z.B. Cmder ([https://github.com/cmderdev/cmder](https://github.com/cmderdev/cmder)) oder Git for Windows mit&nbsp;Bash ([https://git-scm.com](https://git-scm.com)) oder die Shell die bei node.js dabei ist (glaube grunt brauch nodejs). Alternativ einen Editor wie Visual Studio Code, der liefert so weit ich weiß node.js für Windows vorkonfiguriert aus.

&nbsp;Ich habe jetzt node.js runtergeladen und in phpStorm eingebunden.

Aber in phpStorm hae ich auch eine „Command Line Tools Console“ gefunden. Ist das so&nbsp;eine Konsole, von der Du schreibst?

---

<div class="post-metadata">

**Author:** ![mastox](https://avatars.discourse-cdn.com/v4/letter/m/48db29/32.png) [@mastox](https://forum.shopware.com/u/mastox)\
**Post date:** [26. Oktober 2018 um 08:13 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/14 "2018-10-26T08:13:51Z")

</div>

Also wenn du deine JS und CSS Datein on the fly generieren willst brauchst du node und grunt.

Ansonsten musst du Template Cache leeren und neu Kompilieren bei jeder Änderung.

[https://developers.shopware.com/designers-guide/best-practice-theme-development/](https://developers.shopware.com/designers-guide/best-practice-theme-development/)

Wichtig ist wenn du grunt verwendest, ist das du in den Template Einstellungen den cache noch deaktivierst.

---

<div class="post-metadata">

**Author:** ![10083349](https://avatars.discourse-cdn.com/v4/letter/1/bc79bd/32.png) [@10083349](https://forum.shopware.com/u/10083349)\
**Post date:** [27. Oktober 2018 um 06:43 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/15 "2018-10-27T06:43:49Z")

</div>

danke mastox, nur das ist mein Problem. In dem Link, den du mir geschickt hast, sind nur Anleitungen für Linus und MAC:

- Install Node.js/npm on Ubuntu 14.04
- Install Node.js/npm on Mac OS X

Dann geht es weiter mit:

- Install the Grunt CLI

Dort soll ich in&nbsp;

```
sudo npm install -g grunt-cl

```

eingeben. Ich arbeite mir PHPStorm unter Windows. Ich weiß nicht, wo ich das Kommnando eingeben kann. In die Windowskonsole geht es nicht.

---

<div class="post-metadata">

**Author:** ![mastox](https://avatars.discourse-cdn.com/v4/letter/m/48db29/32.png) [@mastox](https://forum.shopware.com/u/mastox)\
**Post date:** [27. Oktober 2018 um 08:51 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/16 "2018-10-27T08:51:45Z")

</div>

Ich kenne nur PHPStorm unter Linux 😉

Normal musst du nur node installieren&nbsp;[Download | Node.js](https://nodejs.org/en/download/)

Dann kannst du in der Windows Konsole Start -\> Ausführen -\> cmd die NPM befehle verwenden du musst nur das sudo weglassen.

 ![](https://europe1.discourse-cdn.com/flex013/uploads/shopware/original/2X/e/e0f4ec72f4670a09b29dc819987efbcd1242f26a.png)

---

<div class="post-metadata">

**Author:** ![10083349](https://avatars.discourse-cdn.com/v4/letter/1/bc79bd/32.png) [@10083349](https://forum.shopware.com/u/10083349)\
**Post date:** [27. Oktober 2018 um 10:45 UTC](https://forum.shopware.com/t/javascript-datei-einbinden/55970/17 "2018-10-27T10:45:53Z")

</div>

Danke für den Hinweis, das sudo wegzulassen.

Jetzt funktioniert es.
