Wie vermeidet man Caching während der Entwicklung?

Gibt es eine einfache Möglichkeit, um jegliches Caching beim Testen der Darstellung von Änderungen an der Site zu verhindern? Ich benutze WP Super Cache. Ich kann den Cache mit der angegebenen Option löschen, den Cache für meinen Browser löschen und trotzdem werden einige Änderungen an CSS oder Widgets nicht aktualisiert. Ich versuche andere Workarounds wie das Wechseln zwischen Browsern oder Computern, aber es muss einen optimierten Workflow geben, in dem ich sicherstellen kann, dass ich die vorgenommenen Änderungen und nicht ein zwischengespeichertes früheres Format ansehe. Was ist die beste Lösung dafür?

Fügen Sie das filemtime()Ihres Stylesheets als Versionsparameter hinzu. Nehmen wir an, Ihr Standard-Stylesheet befindet sich in css/default.cssund css/default.min.css( nichtstyle.css ). Wenn wir ein Stylesheet auf wp_loaded( nichtinit ) registrieren , können wir eine Version als vierten Parameter übergeben. Dies ist die letzte geänderte Zeit und wird daher jedes Mal geändert, wenn wir die Datei ändern.

$min    = WP_DEBUG ? '': '.min';
$file   = "/css/default$min.css";
$url    = get_template_directory_uri() . $file;
$path   = get_template_directory() . $file;
$handle = get_stylesheet() . '-default';

// Overridden?
if ( is_child_theme() && is_readable( get_stylesheet_directory() . $file ) )
{
    $url  = get_stylesheet_directory_uri() . $file;
    $path = get_stylesheet_directory()     . $file;
}

$modified = filemtime( $path );

add_action( 'wp_loaded', function() use ( $handle, $url, $modified ) {
    wp_register_style( $handle, $url, [], $modified );
});

add_action( 'wp_enqueue_scripts', function() use ( $handle ) {
    wp_enqueue_style( $handle );
});

Wenn Sie Node.js und Grunt verwenden, empfehle ich Browsersync . Es überwacht Ihre Dateien und aktualisiert sie sofort, wenn sie sich ändern. Es kann auch die Bildlaufposition synchronisieren, Formulare übermitteln und vieles mehr in mehreren offenen Browsern. Sehr cool.

Nachdem ich viele Male nach einer einfachen Lösung gesucht hatte, entschied ich mich, etwas zu finden, das funktioniert!

Also ... nachdem ich darüber nachgedacht hatte, fand ich eine großartige Möglichkeit, das Caching zu überschreiben, während ich neue Websites entwickelte ... (und es ist einfach).

Was wir brauchen, ist zu sagen, wp das ist eine neue CSS-Version wie diese ...

Vor Änderungen:

wp_enqueue_style( 'maincss', get_template_directory_uri() . '/css/style.css', array(), false, 'all' );

Nach Änderungen:

wp_enqueue_style( 'maincss', get_template_directory_uri() . '/css/style.css?v='.time(), array(), false, 'all' );

Folgendes haben wir hinzugefügt:

?v='.time()

Erläuterung:
Wir fügen der CSS-Datei im Grunde genommen eine dynamische Versionsnummer hinzu, die den Browser zwingt, die neue CSS jedes Mal zu laden, wenn wir sie aktualisieren.

Vergessen Sie nicht, es zu entfernen, nachdem Sie mit dem Entwickeln fertig sind. Andernfalls funktioniert das Zwischenspeichern für diese Datei nicht und wird für wiederkehrende Benutzer immer wieder geladen.

Diese Technik funktioniert für CSS & JS-Dateien - hoffe, das hilft;)

Dies mag übermäßig einfach erscheinen, aber wie wäre es, wenn Sie nur das Caching deaktivieren, bis Sie mit dem Entwicklungsteil Ihrer Site fertig sind? Das Ein- und Ausschalten ist mehr als einfach.

Ich weiß, dass dieser Frage eine Antwort zugestimmt wurde, aber ich denke, dass diese Antwort für das vorliegende Problem immer noch zu kompliziert ist und je nach Benutzer möglicherweise falsch ist (aber keine Beleidigung) wie ich Caching umgehe, wenn ich meinen Entwickler mache (nicht nur mit Wordpress).

Die meisten modernen Browser haben einen Inkognito-Modus . In diesem Modus wird nichts auf Ihrem Computer zwischengespeichert, sodass jede Aktualisierung ein neuer Schieferdownload vom Server ist. Im Internet Explorer drücken Sie Ctrl + Shift + P. In Firefox und Chrome drücken Sie Ctrl + Shift + N.

Wenn Ihr Browser nicht über den Inkognito-Modus verfügt, können Sie normalerweise ein hartes Neuladen erzwingen, indem Sie Ctrl + F5auf IE oder Ctrl + Shift + Rauf Firefox und Chrome drücken .

Ihre Frage zu den CSS-Dateien (und im Wesentlichen zu allen Asset-Dateien wie Bildern und Javascript-Dateien) wird von WP Super Cache in keiner Weise zwischengespeichert. Ihre Einstellungen und / oder die Verwendung dieses Plugins haben keinen Einfluss darauf, wie diese Dateien bereitgestellt werden. Was diese Dateien zwischenspeichert, ist Ihr Browser , und das ist der Grund, warum Sie ein hartes Neuladen durchführen.

Das Plugin wertet aus, wie Wordpress Ihre HTML-Dateien erstellt (über PHP), und speichert eine Kopie, sodass diese beim nächsten Abruf desselben Beitrags, derselben Seite oder was auch immer der Kopie zur Verfügung gestellt wird und nicht muss Werten Sie das von PHP generierte HTML erneut aus, und sparen Sie dadurch Rechenzeit. Dadurch werden Ihre Seiten viel schneller geladen. (Ich hoffe das ist klar.)

Das Problem mit dieser ist, wenn Sie sich schlagend auf einem Zeitstempel auf dem CSS - Dateien URL über eine PHP - Funktion, die ist eine PHP - Auswertung in HTML, und das wird von WP Super Cache zwischengespeichert werden. Jede Anfrage an denselben Beitrag hat denselben Zeitstempel, da den Benutzern eine Kopie der ursprünglichen Zeitstempelauswertung zugestellt wird. (Korrigieren Sie mich, wenn ich falsch liege.)

Die richtige Möglichkeit, das Zwischenspeichern von WP Super Cache zu umgehen, besteht darin, die Option Don't cache for known usersauf trueder Einstellungsseite des Plugins festzulegen.

Schließlich (und dies ist eine persönliche Präferenz, da ich in Bezug auf das Codieren ein echter Stickler bin) müssen Sie nicht unnötige Markups auf Ihren HTML-Seiten hinzufügen, wenn Sie inkognito oder erzwungenes, hartes Neuladen verwenden. Das Hinzufügen eines Zeitstempels fügt natürlich nur ungefähr 13 Bytes pro statische Datei und Anforderung hinzu, aber hey, wie gesagt, ich bin ein Verfechter dieser Art von Dingen. Es sind immer noch 13 Bytes unnötig.

Meine Güte, viele Möglichkeiten, diese zu beantworten! Zuallererst haben Sie nach zwei verschiedenen Dingen gefragt: WP Super Cache und CSS-Dateien. Diese werden an verschiedenen Stellen unterschiedlich zwischengespeichert, daher ist es wichtig zu erkennen, wo sich Ihr Problem befindet.

Bei WP Super Cache können Sie die Konstante DONOTCACHEPAGEin Ihrer functions.php während der Entwicklung definieren, um zu verhindern, dass WP Super Cache irgendetwas zwischenspeichert. Vergessen Sie nicht, dies beim Start zu entfernen!

define('DONOTCACHEPAGE', true);

Jede Site hat auch einen eindeutigen Schlüssel, den Sie an die URL anhängen können, um eine neue Version der Seite zu laden, die Sie meines Erachtens auf der Registerkarte "Erweitert" finden.

Um eine noch bessere Lösung zu finden, sollten Sie eine Entwicklungsumgebung und eine Produktionsumgebung einrichten, in der WP Super Cache für Ihre Entwicklungsumgebung nicht aktiviert ist (vorausgesetzt, dies ist Ihr Problem).

Wenn Ihr Problem mit CSS / JS-Dateien besteht, lesen Sie die Antwort von toscho und den nachfolgenden Kommentar von m0r7if3r oben.

HyperCache deaktiviert das Caching, wenn Sie als Administrator angemeldet sind. Nicht sicher, ob WP Super Cache die gleiche Funktionalität hat.

Wenn Sie Chrome verwenden (was ich sehr empfehle), öffnen Sie den Inspector, klicken Sie auf das Einstellungssymbol in der unteren rechten Ecke und wählen Sie unter "Netzwerk" die Option "Cache deaktivieren".

Wie gesagt für wp super cache, aber für allgemeines WP caching in wp-config.php Change to this:

define( 'WP_CACHE', false );

Referenz: codex.wordpress.org

Sie können dieses Snippet https://gist.github.com/jhayiwg/92bae4330aeb738a98022d7ab63ce9b1 verwenden

Jedes Mal, wenn Sie die Seite laden, wird eine neue Version Ihres aktiven Themas css und js generiert