Wie kann ich CSS minimieren, nachdem ich die "nicht-minimierte" CSS-Datei eines Grav-Themas aktualisiert habe?

Question

Ich verwende die Saturn Site Thema von Grav (https://getgrav.org/downloads/skeletons) und möchte das Hintergrundbild der Homepage (und schließlich andere Stile) ändern. Im benutzerdefinierten CSS des Themas (user/themes/saturn/css/custom.css) habe ich das Hintergrundbild geändert, aber das neue Bild wird nicht wiedergegeben, es sei denn, ich aktualisiere beide custom.css und custom.min.css.

Ich glaube, es ist unangemessen, beide Dateien zu ändern; Das System sollte eine neue Version des minimierten CSS generieren. Lesen der Dokumentation Grav (https://learn.getgrav.org/themes/asset-manager) entdeckte ich, dass Grav

einem Asset-Pipeline liefert, die verwendet werden können, um minify und Vermögenswerte komprimieren die Anzahl der Browser-Anfragen zu reduzieren und auch die Gesamtgröße des Vermögens.

Wie führe ich diese Pipeline/zu aktualisieren, um das CSS ist das Thema minify? Oder muss ich ein separates CSS-Minifying-Tool installieren?

Zusätzliche Informationen: Meine user/config/system.yaml-Datei enthält diese:

assets: css_pipeline: false # The CSS pipeline is the unification of multiple CSS resources into one file css_minify: true # Minify the CSS during pipelining css_rewrite: true # Rewrite any CSS relative URLs during pipelining

Answer 1

Während im Stammverzeichnis von GRAV versuchen bin/grav clear ausgeführt wird. Das sollte die minimierte CSS-Datei ebenfalls aktualisieren.

Answer 2

Grav minimiert nur die Dateien, die im Theme geladen sind.

Nach https://github.com/getgrav/grav-theme-saturn/blob/develop/templates/partials/base.html.twig, custom.min.css ist die geladene CSS-Datei, also wird Grav es minimieren, nicht custom.css.

Sie haben 3 Lösungen:

1. Bearbeiten Sie die Zeile in base.html.twig {% do assets.addCss('theme://css/custom.min.css') %} zu {% do assets.addCss('theme://css/custom.css') %} dann können Sie alles, was Sie hinzufügen möchten, damit Sie es custom.css und Grav wird minify. Wenn Sie dies jedoch tun, wird Ihre Änderung in base.html.twig verloren gehen, wenn Sie das Thema aktualisieren.
2. Sie fügen einfach CSS zu hinzu und Sie müssen es nicht minimieren (obwohl sein Name *.min.css ist), Grav wird Ihnen helfen, es zu minimieren. Auf diese Weise gehen Ihre Änderungen in custom.min.css weiterhin verloren, wenn Sie das Design aktualisieren.
3. Erstellen Sie ein untergeordnetes Thema dieses Designs, überschreiben Sie base.html.twig und wenden Sie die erste oder zweite Lösung oben an. Auf diese Weise geht Ihre Änderung nicht verloren, wenn Sie das Design aktualisieren. Dies erfordert jedoch Entwicklungsfähigkeiten.