Hallo,
je tiefer ich mich einarbeite in SW 6 umso mehr Fragen werfen sich mir auf. Ich nutze einerseits das Erklär-Video „[DE] Shopware 6 Quickstart: Installation und erste Schritte“ und natürlich die Guides aus den Handbüchern der DokuSeite, im Augenblick „Plugin quick start“
Mein erstes Ziel ist es, mittels eines einfachen Plugins den die css backround-color mit scss für den Body zu überschreiben.
Im Video wird das erklärt, aber bei mir scheitert es schon daran, das meine Ordnerstruktur mit der im Video nicht übereinstimmt (SW6 installiert mit Vagrant VM und Plugin generiert mit plugin:create) und vermutlich deshalb auch gar nix passiert…
Die Ordnerstruktur für platform ist im Video hier vorgestellt. Da werden die scss Dateien im Unterordner src gefunden…
Bei meiner Apllikation gibt es unter Resources keinen src-Ordner, das Teil liegt viel tiefer verschachtelt und zwar in platform/src/Storefront/Resources/app/storefront/src/scss
Also Fragen hierzu :
- Ist das Video nicht mehr aktuell?
- Wenn nicht, gibt es ein neues?
- Gibt es vielleicht ein besseres Tutorial, welche sich nur mit Theme überschreiben beschäftigt (inkl scss & js)?
Ich habe nun ein Test-Plugin installiert, mit welchem ich einfach nach dieser Anleitung css generieren will. Meine Plugin-Struktur sieht so aus:
Dann via Console
vagrant@shopware:~/shopware-dev$ ./psh.phar storefront:dev
###################
SHOPWARE Developer Version
_
| |
___| |__ ________ _____ ___ ___
/ __| '_ \ / _ \| '_ \ \ /\ / / _` | '__ / _ \
\__\ | | | (_) | |_) \ V V / (_| | | |__/
| ___/_| |_|\___ /| . __/ \_/\_/ \__ ,_|_| \___|
| |
|_|
Using .psh.yaml.dist extended by .psh.yaml.override
Starting Execution of 'storefront:dev' ('/home/vagrant/shopware-dev/dev-ops/storefront/actions/dev.sh')
(1/4) Starting
> bin/console bundle:dump
[OK] Dumped plugin configuration.
(2/4) Starting
> PROJECT_ROOT=/home/vagrant/shopware-dev/ npm --prefix vendor/shopware/platform/src/Storefront/Resources/app/storefront/ run development
> sw-next-storefront@1.0.0 development /home/vagrant/shopware-dev/vendor/shopware/platform/src/Storefront/Resources/app/storefront
> NODE_ENV=development webpack --config webpack.config.js
# Webpack Plugin Injector: Plugin "Storefront" injected as a new entry point
ℹ USING WEBPACK CONFIG FILE: ./build/webpack.dev.config.js
Browserslist: caniuse-lite is outdated. Please run next command `npm update`
ℹ Compiling Shopware 6 Storefront
✔ Shopware 6 Storefront: Compiled successfully in 21.89s
> PROJECT_ROOT=/home/vagrant/shopware-dev/ npm --prefix vendor/shopware/platform/src/Storefront/Resources/app/storefront/ run development
> sw-next-storefront@1.0.0 development /home/vagrant/shopware-dev/vendor/shopware/platform/src/Storefront/Resources/app/storefront
> NODE_ENV=development webpack --config webpack.config.js
# Webpack Plugin Injector: Plugin "Storefront" injected as a new entry point
ℹ USING WEBPACK CONFIG FILE: ./build/webpack.dev.config.js
Browserslist: caniuse-lite is outdated. Please run next command `npm update`
ℹ Compiling Shopware 6 Storefront
✔ Shopware 6 Storefront: Compiled successfully in 21.89s
DONE Compiled successfully in 26423ms11:27:09 AM
159 modules
(3/4) Starting
> bin/console assets:install
Installing assets as hard copies.
--- ---------------- ----------------
Bundle Method / Error
--- ---------------- ----------------
✔ Framework copy
✔ Administration copy
✔ Storefront copy
--- ---------------- ----------------
! [NOTE] Some assets were installed via copy. If you make changes to these
! assets you have to run this command again.
[OK] All assets were successfully installed.
(4/4) Starting
> bin/console theme:compile
Start theme compilation
159 modules
(3/4) Starting
> bin/console assets:install
Installing assets as hard copies.
--- ---------------- ----------------
Bundle Method / Error
--- ---------------- ----------------
✔ Framework copy
✔ Administration copy
✔ Storefront copy
--- ---------------- ----------------
! [NOTE] Some assets were installed via copy. If you make changes to these
! assets you have to run this command again.
[OK] All assets were successfully installed.
(4/4) Starting
> bin/console theme:compile
Start theme compilation
! [NOTE] Took 26.303883 seconds
Duration: 58s
All commands successfully executed!
vagrant@shopware:~/shopware-dev$
Aber aus dem Plugin-Ordner wurde nichts kompiliert, auch kein public-Ordner wurde generiert…
command from inside the development template directory:
./psh.phar storefront:build
Important note: This might also generate a
public
directory inside your plugin. Always ship this directory with your plugin, do not exclude or remove it!
Und ich verstehe diesen Satz nicht
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/storefront/
Heißt das nun, ich muß für das compiling in der webpack.config etwas anpassen? Wenn ja was und wo? Oder schaut SW automatisch in den plugin storefront Ordner nach einer main.js?
Nun hoffe ich mal auf Antworten, bislang scheine ich mich hier allein zu unterhalten bezugnehmend auf meine anderen Fragen. Schließlich will ich ja SW benutzen und nicht verteufeln Wenn es das falsche Forum ist, nicht zögern mich auf das richtige hinzuweisen…
Gruß Rammi