2017-07-02 1 views
0

Ich muss oft meine Skripte (js) und Stile (CSS) in meiner Web-App bearbeiten, aber sie werden zwischengespeichert, so dass die Website die Änderungen nicht widerspiegelt. Auch das Löschen jedes Mal, wenn der Browser-Cache das Problem nicht behebt. Ich muss den Dateinamen (für js oder css) jedes Mal ändern, um die Änderungen anzuzeigen, aber das ist wirklich ärgerlich.Was ist die beste Vorgehensweise zum Bearbeiten von .js- und .css-Dateien und Vermeiden von Caching während der Entwicklung?

Ich bin sicher, dass ich hier einen Punkt vermisse. Können Sie bitte vorschlagen?

Dank

+3

Wenn Sie Chrome verwenden, sollte STRG + F5 die Ressourcen aktualisieren. Wenn nicht, überprüfen Sie Ihre Browsereinstellungen. Sie können Chrome so einrichten, dass Ressourcen nicht über die Entwicklerwerkzeuge (F12)> Einstellungen gechachtert werden. –

+0

Ich benutze Safari, Firefox und CHrome (auf Mac), aber Strg + F5 behebt das Problem nicht. –

+0

Abhängig davon, ob der Editor es hat, sollten Sie in Live Refresh/Reload oder etwas ähnliches suchen. Dies aktualisiert die Seite automatisch, ohne erneut zu laden. – Pim

Antwort

1

die Seite aktualisieren sollte in jedem Browser den Trick. Wenn die JavaScript/CSS-Dateien jedoch in einem Teil der Seite verknüpft sind, der dynamisch geladen wird, kann das ein wenig kompliziert sein. Sie können dem Dateinamen einen Parameter hinzufügen. Dies ist keine ideale Lösung, aber es kann das Problem lösen:

<script type="text/javascript" src="/myscript.js?i=123"></script> 

Nun werden Sie den Wert des Parameters jedes Mal ändern müssen. Um dies zu tun, müssen Sie die Datei mit JavaScript verknüpfen. Etwas wie:

<script>document.write("<script type='text/javascript' src='/myscript.js??v=" + Date.now() + "' /><\/script>");</script> 
0

Sie den Code unten in einer .htaccess Datei hinzufügen kann (Sie unter der Annahme von Windows verwenden, nicht auf dem Server):

<filesMatch "\.(js|css)$"> 
    FileETag None 
    <ifModule mod_headers.c> 
    Header unset ETag 
    Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate" 
    Header set Pragma "no-cache" 
    Header set Expires "Wed, 11 Jan 1984 05:00:00 GMT" 
    </ifModule> 
</filesMatch> 
1

Strg + Shift + R oder cmd + shift + R, um den Browser-Cache in Chrome zu löschen.

Sie können auch den Cache deaktivieren (während DevTools geöffnet ist) chrome Option.

Verwandte Themen