2011-12-27 22 views
8

sto usando meno in modalità di JS (less.js) nel seguente modo:LessCSS ferma stili di elaborazione

<link rel="stylesheet/less" href="assets/styles/less/bootstrap.less" media="all"> 
<script src="assets/scripts/libs/less-1.1.5.min.js"></script> 

E dopo alcune pagine viste, si interrompe l'elaborazione degli stili e dà una versione "cache". Per farlo ri-analizzare gli stili devo cancellare i cookie del browser. Qualcuno sa perché è questo? C'è qualche opzione per farlo ri-analizzare su ogni visualizzazione di pagina? Grazie mille!

UPDATE: Rivedere parte del codice libreria, sembra che usi localStorage per archiviare i fogli di stile come cache. Si basa sull'ultimo orario modificato del file per aggiornare la cache, ma per qualche motivo non funziona correttamente perché non sta prendendo le mie modifiche ...

risposta

17

Ho appena trovato un issue in GitHub per questo. Citando me stesso:

Questo capita anche a me in 1.1.5. Lo script utilizza localStorage per memorizzare i fogli di stile. Cancellare la cache del browser non funzionerà. Devi cancellare i suoi cookie (disconnettendo tutti i tuoi account,%! @^#%) O facendo localStorage.clear(). Io uso questo prima less.js di carico (se non utilizzano localStorage me stesso):

<script> /* Provisory for dev environment: */ localStorage.clear(); </script> 

Quando si va alla produzione è sufficiente compilare i fogli di stile CSS per

+0

Non è necessario asciare tutto lo spazio locale, è sufficiente eliminare i tasti relativi a MENO.Le chiavi assomigliano a 'http {s}: // {host}/path/to/file.less' e una chiave correlata' http {s}: // {host} /path/to/file.less: timestamp' . – Marius

0

Il motivo che memorizza nella cache è perché ci vuole tempo per generare i file css e quel tempo può aggiungere un'esperienza utente negativa se si ha un sacco di codice da compilare.

si potrebbe mettere questo nei documenti HTML:

<META HTTP-EQUIV="Pragma" CONTENT="no-cache"> 
<META HTTP-EQUIV="Expires" CONTENT="-1"> 

ma che sarebbe disabilitare la cache di tutte le risorse non solo i meno file.

+0

Ciò disabiliterà la memorizzazione nella cache dei file estratti dal server. Qui il problema è diverso, ad esempio less.js aggiunge un altro livello di memorizzazione nella cache in localstorage. – ShitalShah

4

È possibile utilizzare le seguenti operazioni per disattivare la cache localStorage:

<script>var less=less||{};less.env='development';</script> 
<script src="path_to_less.js"></script> 
+0

In quale posto lo metto? –

+0

Questo è sbagliato. 'less.env =" sviluppo "' rende less.js generare errori di compilazione nel documento, 'less.watch()' attiva l'auto-ricarica dei fogli di stile. Nessuno di questi disabilita o cancella la cache. –

+0

@Artur 'less.env =" sviluppo "' funziona bene (ma non c'è bisogno di 'less.watch()'). –

5

Bello trovare con il localStorage. La soluzione più rapida, quindi, è quello di aprire console del browser ed eseguire il seguente comando:

localStorage.clear(); 

quindi aggiornare e sei a posto.

0

Un modo migliore per farlo sarebbe passare noCache = 1 nell'URL per cancellare il browser localStorage quando si stanno sviluppando in meno file, quindi imposta un cookie per ricordarsi di cancellarlo ogni volta e quindi si potrebbe mettere noCache = 0 per disinserire il cookie, in questo modo l'utente finale non finisce con l'avere il loro localStorage cancellato quando si utilizza il sito e si può solo lasciarlo in.

$(document).ready(function() {<br> 
    if(window.location.href.indexOf("noCache=1") > -1) {<br> 
     $.cookie('noCache', '1', { expires: 1, path: '/' });<br> 
     localStorage.clear();<br> 
    }<br> 
    if(window.location.href.indexOf("noCache=0") > -1) {<br> 
     $.cookie('noCache', '0', { expires: 1, path: '/' });<br> 
    }<br> 
    if ($.cookie('noCache') == '1'){<br> 
    alert ("disabled Cache");<br> 
    localStorage.clear();<br> 
    }<br> 
});<br> 
<br> 

dovrai jquery cookie plug-in per questo al lavoro

+0

Impronta così grande ... –

0

è inoltre possibile aggiungere un parametro univoco per impedire il caching, come ad esempio se si utilizza php:

<link rel="stylesheet/less" href="assets/styles/less/bootstrap.less?v=<?= uniqid() ?>" media="all">