Plugin Javascript File wird nicht geladen

Hallo,

ich habe wie in der Doku beschrieben in meinem Plugin eine main.js angelegt.

If you don’t want to create a custom webpack configuration, you can use the Shopware webpack build configuration. In order to do that, you have to define an entry-point, so webpack knows where to get started. In Shopware 6, this entry-point is a main.js file inside of the following directory:  /src/Resources/app/storefront/src

leider wird das Javascript weder mit cache:clear noch mit theme:compile geladen… CSS wird aus dem Plugin schon geladen.

An was liegt das? Hab ich was vergessen?

hab auch irgendwas mit storefront:build gelesen, aber das kann ich in der Produktivumgebung natürlich nicht ausführen…

weiß niemand was dazu?

Guten Tag, 

auch in dem Production Template lässt sich die Storefront bauen: https://github.com/shopware/production/blob/6.1/bin/build-storefront.sh

Danach sollte in deinem Plugin Ordner eine js Datei mit dem gebauten Inhalt in /src/Resources/app/storefront/dist/storefront/js auftauchen.

 

Viele Grüße aus Schöppingen,

Hallo @taltholtmann‍,

danke für den Tipp! Wie führ ich das korrekt aus?

 bin/build-storefront.sh

ergibt leider ein „permission denied“

EDIT: File-Permissions für die build-storefront.sh war 666, das reicht wohl nicht. Hab jetzt testweise mal auf 777 gestelt, jetzt läuft das wenigstens. Erzeugt aber neue Fehler:

bin/build-storefront.sh: line 9: npm: command not found
bin/build-storefront.sh: line 10: node: command not found
bin/build-storefront.sh: line 11: npm: command not found

 

@taltholtmann‍ kannst du helfen?

Du benötigst Node auf deinem Server um diese Befehle auszuführen. Meistens kannst du das nur auf einem root nachinstallieren , ansonsten schau mal bei deinem Hosting Portal ob sich da was machen lässt.

 

Grüße

okay danke @shoshosho‍

ich versuch das mal … normalerweise sollten wir die Rechte haben, das zu installieren

aber was ist jetzt, wenn man mal ein Kundenprojekt hat, wo man das nicht nachinstallieren kann?

@FloC3 schrieb:

okay danke @shoshosho‍

ich versuch das mal … normalerweise sollten wir die Rechte haben, das zu installieren

aber was ist jetzt, wenn man mal ein Kundenprojekt hat, wo man das nicht nachinstallieren kann?

Steht in den Docs https://github.com/shopware/production#requirements 

Allerdings verstehe ich den Satz nicht so recht „Expect“ heißt erwarten. Meinten die except? [@Moritz Naczenski](http://forum.shopware.com/profile/14574/Moritz Naczenski „Moritz Naczenski“)‍ ein Schreibfehler?

leider klappt das so auch nicht… Hab Node jetzt installiert, zack gibts den nächsten Fehler beim Ausführen von build-storefront.sh

Error: Cannot find module 'app-module-path'

was hat es nun damit wieder auf sich?

Und warum zur Hölle ist der Kram so kompliziert? Erst recht im Vergleich zu SW5 Themes.

1 „Gefällt mir“

Daran ist eigentlich nichts kompliziert - Nur eben wenn man sich mit der neusten Technik nicht auskennt. Web Technologien entwickeln sich eben weiter. Diese Repos richten sich in erster Linie an Entwickler. 

Hast du auch npm installiert?

Welche node version, welche npm version? Auf meinen Server kann ich es problemlos ausführen. node 10.16.0, npm 6.9.0

npm is distributed with Node.js- which means that when you download Node.js, you automatically get npm installed on your computer

–> nein, ich hab npm nicht separat installiert sondern war bei node mit dabei. –> npm Version 6.13.7

neueste Technik hin oder her… warum etwas unnötig verkomplizieren, nur um die neueste Technik einzusetzen?

Node-Version hab ich die installiert, die halt installiert wird beim Command „node install“ auf Hetzner.

 node-13.8.0.x86_64_linux.bottle.tar.gz

 

EDIT :

hab jetzt  npm install app-module-path --save manuell installiert… jetzt kommt ein neuer Fehler.

Error: Cannot find module 'webpack-merge'
...
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! sw-next-storefront@6.1.3 production: `NODE_ENV=production webpack --config webpack.config.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the sw-next-storefront@6.1.3 production script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

hab dann im Internet den Befehl gefunden für dieses Problem: npm i -D webpack-merge

_d_anach gings weiter, jetzt mit nem neuen Fehler:

Error: Cannot find module 'copy-webpack-plugin'

muss ich das ganze Zeug jetzt manuell nachinstallieren? Wieso das?
 

EDIT 2:

es geht weiter… diesmal  npm install --save-dev copy-webpack-plugin installiert… jetzt der neue Fehler

Error: Cannot find module '@shopware/webpack-copy-after-build'

aber diesmal finde ich keinen Weg das zu lösen…

npm WARN saveError ENOENT: no such file or directory, open '/.../shopware/.../package.json'
npm WARN enoent ENOENT: no such file or directory, open '/.../shopware/.../package.json'
npm WARN copy-webpack-plugin@5.1.1 requires a peer of webpack@^4.0.0 || ^5.0.0 but none is installed. You must install peer dependencies yourself.

es kann doch nicht sein, dass in einer Production-Umgebung so ein Aufstand betrieben werden muss um ein paar simple Zeilen Javascript zu integrieren… 

kann ich mein Script einfach direkt in diesen dist-Ordner kopieren?

Guckst du hier:

Das Problem scheint bei dir zu sein, dass npm install nicht korrekt ausgeführt wird oder ähnl. / die nötigen modules sind nicht installiert.

Denn das Shell Script macht ja nichts anderes.

Die ganzen Befehle solltest du eigentlich gar nicht nötig haben, da das alles über das Script, respekltive npm install automatisch erledigt werden sollte.

Evtl. hilft es einfach einmal den gesamten node_modules Ordner zu löschen und build-storefront.sh erneut zu starten. Das kann oft solche Probleme beheben.

Evtl. hilft es einfach einmal den gesamten node_modules Ordner zu löschen und build-storefront.sh erneut zu starten

habe ich getan. Dann gehts wieder von vorn mit den Fehlern los:

Error: Cannot find module 'app-module-path'

 

weiß denn niemand hier was? Ich hab mein Script jetzt einfach nach /dist kopiert und es läuft, ja… aber das ist nich Sinn der Sache.

Bitte um Hilfe, am besten von Shopware… kann nicht so schwer sein, so ein sch*** JS einzubinden.

Wenn es um die build-storefront.sh geht, kommentiere mal diese Zeile aus. 

 npm --prefix ${STOREFRONT\_ROOT}/Resources/app/storefront clean-install

Damit wird dann schon mal nicht jedesmal npm neu installiert.

Danach gehst du in diesen Ordner /shopware/vendor/shopware/storefront/Resources/app/storefront & installierst dort npm. So das der “node_modules” Ordner existiert.

 

@CallMeAlex‍

hab genau gemacht was du geschrieben hast.

Error: Cannot find module 'app-module-path'
code: 'MODULE_NOT_FOUND',

kann doch nicht so kompliziert sein Mensch… ein blödes Javascript zu adden

diese Unterscheidung Develop/Production ist eh irgendwie zum Kotzen… Shops weiterentwickeln im laufenden Betrieb ist damit ja fast unmöglich…

hab jetzt für build-administration.sh das selbe Problem (in Production)

0 info it worked if it ends with ok
1 verbose cli [
1 verbose cli '/usr/home/myshop/.linuxbrew/Cellar/node/13.8.0/bin/node',
1 verbose cli '/usr/home/myshop/.linuxbrew/bin/npm',
1 verbose cli 'run',
1 verbose cli '--prefix',
1 verbose cli '/usr/www/users/myshop/systems/shopware/sw6/www.myshop.de/vendor/shopware/administration/Resources/app/administration/',
1 verbose cli 'build'
1 verbose cli ]
2 info using npm@6.13.7
3 info using node@v13.8.0
4 verbose run-script ['prebuild', 'build', 'postbuild']
5 info lifecycle administration@6.1.3~prebuild: administration@6.1.3
6 info lifecycle administration@6.1.3~build: administration@6.1.3
7 verbose lifecycle administration@6.1.3~build: unsafe-perm in lifecycle true
8 verbose lifecycle administration@6.1.3~build: PATH: /usr/home/myshop/.linuxbrew/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/usr/www/users/myshop/systems/shopware/sw6/www.myshop.de/vendor/shopware/administration/Resources/app/administration/node_modules/.bin:/usr/home/myshop/.linuxbrew/bin:/usr/home/myshop/.linuxbrew/sbin:/usr/local/bin:/usr/bin:/bin:/usr/local/games:/usr/games
9 verbose lifecycle administration@6.1.3~build: CWD: /usr/www/users/myshop/systems/shopware/sw6/www.myshop.de/vendor/shopware/administration/Resources/app/administration
10 silly lifecycle administration@6.1.3~build: Args: ['-c', 'node build/build.js']
11 silly lifecycle administration@6.1.3~build: Returned: code: 1 signal: null
12 info lifecycle administration@6.1.3~build: Failed to exec build script
13 verbose stack Error: administration@6.1.3 build: `node build/build.js`
13 verbose stack Exit status 1
13 verbose stack at EventEmitter. (/usr/home/myshop/.linuxbrew/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:332:16)
13 verbose stack at EventEmitter.emit (events.js:321:20)
13 verbose stack at ChildProcess. (/usr/home/myshop/.linuxbrew/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
13 verbose stack at ChildProcess.emit (events.js:321:20)
13 verbose stack at maybeClose (internal/child_process.js:1026:16)
13 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:286:5)
14 verbose pkgid administration@6.1.3
15 verbose cwd /usr/www/users/myshop/systems/shopware/sw6/www.myshop.de
16 verbose Linux 4.19.0-8-amd64
17 verbose argv "/usr/home/myshop/.linuxbrew/Cellar/node/13.8.0/bin/node" "/usr/home/myshop/.linuxbrew/bin/npm" "run" "--prefix" "/usr/www/users/myshop/systems/shopware/sw6/www.myshop.de/vendor/shopware/administration/Resources/app/administration/" "build"
18 verbose node v13.8.0
19 verbose npm v6.13.7
20 error code ELIFECYCLE
21 error errno 1
22 error administration@6.1.3 build: `node build/build.js`
22 error Exit status 1
23 error Failed at the administration@6.1.3 build script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [1, true]

was mach ich nur falsch? Ich bekomms einfach nicht gebuildet…

EDIT: der Fehler hat sich jetzt verändert…

0 info it worked if it ends with ok
1 verbose cli [
1 verbose cli '/usr/home/myshop/.linuxbrew/Cellar/node/13.8.0/bin/node',
1 verbose cli '/usr/home/myshop/.linuxbrew/bin/npm',
1 verbose cli 'run',
1 verbose cli '--prefix',
1 verbose cli '/usr/www/users/myshop/systems/shopware/sw6/www.myshop.de/vendor/shopware/administration/Resources/app/administration/',
1 verbose cli 'build'
1 verbose cli ]
2 info using npm@6.13.7
3 info using node@v13.8.0
4 verbose run-script ['prebuild', 'build', 'postbuild']
5 info lifecycle administration@6.1.3~prebuild: administration@6.1.3
6 info lifecycle administration@6.1.3~build: administration@6.1.3
7 verbose lifecycle administration@6.1.3~build: unsafe-perm in lifecycle true
8 verbose lifecycle administration@6.1.3~build: PATH: /usr/home/myshop/.linuxbrew/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/usr/www/users/myshop/systems/shopware/sw6/www.myshop.de/vendor/shopware/administration/Resources/app/administration/node_modules/.bin:/usr/home/myshop/.linuxbrew/bin:/usr/home/myshop/.linuxbrew/sbin:/usr/local/bin:/usr/bin:/bin:/usr/local/games:/usr/games
9 verbose lifecycle administration@6.1.3~build: CWD: /usr/www/users/myshop/systems/shopware/sw6/www.myshop.de/vendor/shopware/administration/Resources/app/administration
10 silly lifecycle administration@6.1.3~build: Args: ['-c', 'node build/build.js']
11 silly lifecycle administration@6.1.3~build: Returned: code: 137 signal: null
12 info lifecycle administration@6.1.3~build: Failed to exec build script
13 verbose stack Error: administration@6.1.3 build: `node build/build.js`
13 verbose stack Exit status 137
13 verbose stack at EventEmitter. (/usr/home/myshop/.linuxbrew/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:332:16)
13 verbose stack at EventEmitter.emit (events.js:321:20)
13 verbose stack at ChildProcess. (/usr/home/myshop/.linuxbrew/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
13 verbose stack at ChildProcess.emit (events.js:321:20)
13 verbose stack at maybeClose (internal/child_process.js:1026:16)
13 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:286:5)
14 verbose pkgid administration@6.1.3
15 verbose cwd /usr/www/users/myshop/systems/shopware/sw6/www.myshop.de
16 verbose Linux 4.19.0-8-amd64
17 verbose argv "/usr/home/myshop/.linuxbrew/Cellar/node/13.8.0/bin/node" "/usr/home/myshop/.linuxbrew/bin/npm" "run" "--prefix" "/usr/www/users/myshop/systems/shopware/sw6/www.myshop.de/vendor/shopware/administration/Resources/app/administration/" "build"
18 verbose node v13.8.0
19 verbose npm v6.13.7
20 error code ELIFECYCLE
21 error errno 137
22 error administration@6.1.3 build: `node build/build.js`
22 error Exit status 137
23 error Failed at the administration@6.1.3 build script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [137, true]

gibts auch ne Möglichkeit, das was build-administration.sh tut, manuell auszuführen? Fürs Frontend hab ich es ja so gelöst

Ich hab mein Script jetzt einfach nach /dist kopiert und es läuft, ja… aber das ist nich Sinn der Sache.

das is für mich okay… dann umgeh ich eben diesen Build-Mist. Klappt das so ähnlich mit dem „dist“ auch für Administration? Insbesondere für neue Erlebniswelt-Elemente

 

hab jetzt nochmal node gelöscht und neu installiert inkl npm

ergibt den selben Fehler

> @shopware/administration@1.0.0 lerna /usr/www/users/myshop/systems/shopware/sw6/www.myshop.de/vendor/shopware/administration/Resources
> lerna "bootstrap"

lerna notice cli v3.16.4
lerna info versioning independent
lerna info Bootstrapping 5 packages
lerna info Symlinking packages and binaries
lerna success Bootstrapped 5 packages

> administration@6.1.3 build /usr/www/users/myshop/systems/shopware/sw6/www.myshop.de/vendor/shopware/administration/Resources/app/administration
> node build/build.js

# Webpack Plugin Injector: Plugin "Storefront" injected as a new entry point
# Webpack Plugin Injector: Plugin "SwagPayPal" injected as a new entry point
# Webpack Plugin Injector: Plugin "SwagI18nSpanish" injected as a new entry point
# Webpack Plugin Injector: Plugin "SwagI18nItalian" injected as a new entry point
# Webpack Plugin Injector: Plugin "SwagI18nCzech" injected as a new entry point
# Webpack Plugin Injector: Plugin "AcrisSeoRedirectCS" injected as a new entry point
# Webpack Plugin Injector: Plugin "Newsletter2GoSW6" injected as a new entry point
# Webpack Plugin Injector: Plugin "CogiTags" injected as a new entry point
Building project for production...
(node:7575) DeprecationWarning: loaderUtils.parseQuery() received a non-string value which can be problematic, see https://github.com/webpack/loader-utils/issues/56
parseQuery() will be replaced with getOptions() in the next major version of loader-utils.
Killed
npm ERR! code ELIFECYCLE
npm ERR! errno 137
npm ERR! administration@6.1.3 build: `node build/build.js`
npm ERR! Exit status 137
npm ERR! 
npm ERR! Failed at the administration@6.1.3 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

Fehlercode 137 ist gleich, nur ist seit dem die Meldung etwas anders. Jetzt bekomm ich “KILLED” … und zumindest läuft der Prozess am Anfang los…

was mach ich nur falsch 

Führe einmal ./psh.phar administration:install-dependencies  bzw. storefront:install-dependencies  aus. Das löscht den npm Ordner und installiert alles komplett neu.