Changing an imported file does not cause a re-compile (cache issue ?) #47

Closed
vicb opened this Issue Jun 25, 2010 · 48 comments

Comments

Projects
None yet
@vicb
Contributor

vicb commented Jun 25, 2010

Version 1.0.22.min.js in firefox 3.6.3 on ubuntu 10.04

If the html links to a master.less file which @imports a slave.less:

  • any change to the master.less file would cause changes to be taken into account,
  • however changes in the slave.less file only would not cause changes to be taken into account, leaving the previous version active.

Probably some kind of cache issue ? (clearing ff cache does not help)

@cloudhead

This comment has been minimized.

Show comment
Hide comment
@cloudhead

cloudhead Jun 26, 2010

Member

Yea, something I have to look into.

Member

cloudhead commented Jun 26, 2010

Yea, something I have to look into.

@cloudhead

This comment has been minimized.

Show comment
Hide comment
@cloudhead

cloudhead Jul 1, 2010

Member

I made a change in 1.0.30, which refreshes the cache on page load only in development mode. It should work as a temporary fix for now.

Member

cloudhead commented Jul 1, 2010

I made a change in 1.0.30, which refreshes the cache on page load only in development mode. It should work as a temporary fix for now.

@vicb

This comment has been minimized.

Show comment
Hide comment
@vicb

vicb Jul 1, 2010

Contributor

That would work great when less.env === 'development' however this is not the case in my development environment as I am using a named based virtualhost on port 80 though http protocol which does not satisfy any condition to make an environment development - but I think is a pretty standard configuration.

Do you consider pulling my commit ?

This would:

  • allow config like mine to force refreshing,
  • offer a finer granularity for forcing refresh.

The condition could become something like
typeof(less.reload) == "undefined"?less.env==='development':less.reload

Contributor

vicb commented Jul 1, 2010

That would work great when less.env === 'development' however this is not the case in my development environment as I am using a named based virtualhost on port 80 though http protocol which does not satisfy any condition to make an environment development - but I think is a pretty standard configuration.

Do you consider pulling my commit ?

This would:

  • allow config like mine to force refreshing,
  • offer a finer granularity for forcing refresh.

The condition could become something like
typeof(less.reload) == "undefined"?less.env==='development':less.reload

@raeldc

This comment has been minimized.

Show comment
Hide comment
@raeldc

raeldc Sep 1, 2010

Hi Alexis,

I'm also having some problems related to this issue. It seems that the changes in nested imports don't get recognized right away. Even though I ruined the imported less file, the changes seem to be ignored(using the cache perhaps?).

I just wonder how you cache the compiled less. I don't see it in cookies, and my browser's cache is disabled.

BTW, I found this issue when working on Dominik's Flawless. Check the issue here:
http://github.com/DominikGuzei/flawless.css/issues/issue/1/#comment_383069

Thanks!

raeldc commented Sep 1, 2010

Hi Alexis,

I'm also having some problems related to this issue. It seems that the changes in nested imports don't get recognized right away. Even though I ruined the imported less file, the changes seem to be ignored(using the cache perhaps?).

I just wonder how you cache the compiled less. I don't see it in cookies, and my browser's cache is disabled.

BTW, I found this issue when working on Dominik's Flawless. Check the issue here:
http://github.com/DominikGuzei/flawless.css/issues/issue/1/#comment_383069

Thanks!

@travisdahl

This comment has been minimized.

Show comment
Hide comment
@travisdahl

travisdahl Apr 20, 2011

Whew, thought I was losing my marbles there for a second. Glad I found this ticket to confirm that I'm not totally insane.
Thanks for all your hard work. Having too much fun with less.

Whew, thought I was losing my marbles there for a second. Glad I found this ticket to confirm that I'm not totally insane.
Thanks for all your hard work. Having too much fun with less.

@dave-the-rave

This comment has been minimized.

Show comment
Hide comment
@dave-the-rave

dave-the-rave Aug 17, 2011

yes, I second this, or 5th it, whatever. Been driving me mad trying to have a random value in an included file. Also, just changing the included file, I have to re-save all of the files which import it to see the changes.

yes, I second this, or 5th it, whatever. Been driving me mad trying to have a random value in an included file. Also, just changing the included file, I have to re-save all of the files which import it to see the changes.

@ahmadnassri

This comment has been minimized.

Show comment
Hide comment
@ahmadnassri

ahmadnassri Sep 7, 2011

why not rely on the server's Cache-Control Header along with ETags checks?

why not rely on the server's Cache-Control Header along with ETags checks?

@t1mmen

This comment has been minimized.

Show comment
Hide comment
@t1mmen

t1mmen Sep 9, 2011

+1

I was tearing my hair out too!

t1mmen commented Sep 9, 2011

+1

I was tearing my hair out too!

@leobalter

This comment has been minimized.

Show comment
Hide comment
@leobalter

leobalter Sep 9, 2011

This issue made me stop using js to compile in development env and started using the Less App. But my windows mates are f****.

I gotta check @vicb commit or fork to try a sollution.

This issue made me stop using js to compile in development env and started using the Less App. But my windows mates are f****.

I gotta check @vicb commit or fork to try a sollution.

@cmwelsh

This comment has been minimized.

Show comment
Hide comment
@cmwelsh

cmwelsh Sep 12, 2011

I came here to report this issue too. I appreciate your work.

cmwelsh commented Sep 12, 2011

I came here to report this issue too. I appreciate your work.

@givankin

This comment has been minimized.

Show comment
Hide comment
@givankin

givankin Sep 21, 2011

yeah, this issue is nearly show-stopper when working with multiple files

yeah, this issue is nearly show-stopper when working with multiple files

@leobalter

This comment has been minimized.

Show comment
Hide comment
@leobalter

leobalter Sep 21, 2011

It can be solved with a little trick: before calling less.js file, insert a script with:

less = {}; less.env = 'development';

This will force cache reload.

@cloudhead why not document this and close this issue?

It can be solved with a little trick: before calling less.js file, insert a script with:

less = {}; less.env = 'development';

This will force cache reload.

@cloudhead why not document this and close this issue?

@ahmadnassri

This comment has been minimized.

Show comment
Hide comment
@ahmadnassri

ahmadnassri Sep 21, 2011

@leobalter I've just been using

less.env = 'development';

is the first part required?

@leobalter I've just been using

less.env = 'development';

is the first part required?

@leobalter

This comment has been minimized.

Show comment
Hide comment
@leobalter

leobalter Sep 21, 2011

it's only a fail safe, as I'm proposing to set it before loading less.js, you can get a 'less is not defined' error without setting it as an object.

it's only a fail safe, as I'm proposing to set it before loading less.js, you can get a 'less is not defined' error without setting it as an object.

@neonstalwart

This comment has been minimized.

Show comment
Hide comment
@neonstalwart

neonstalwart Sep 21, 2011

Contributor

@ahmadnassri without less = {}; you're likely to get a javascript error since you're trying to set a property on an undefined variable.

Contributor

neonstalwart commented Sep 21, 2011

@ahmadnassri without less = {}; you're likely to get a javascript error since you're trying to set a property on an undefined variable.

@ttfkam

This comment has been minimized.

Show comment
Hide comment
@ttfkam

ttfkam Sep 21, 2011

Contributor

For the sake of being as terse as possible

 less = {env:'development'};

or if you're worried about clobbering an existing instance of the less variable

 (less = less || {}).env = 'development';
Contributor

ttfkam commented Sep 21, 2011

For the sake of being as terse as possible

 less = {env:'development'};

or if you're worried about clobbering an existing instance of the less variable

 (less = less || {}).env = 'development';
@ahmadnassri

This comment has been minimized.

Show comment
Hide comment
@ahmadnassri

ahmadnassri Sep 21, 2011

@leobalter @neonstalwart true, it would be a general problem, I forgot that I have a custom implementation, I add the environment variable AFTER I include the library and I only trigger less manually through JS actions (I'm doing complex History management and front-end page-reloads) I do like @ttfkam's method though as its fool-proof!

@leobalter @neonstalwart true, it would be a general problem, I forgot that I have a custom implementation, I add the environment variable AFTER I include the library and I only trigger less manually through JS actions (I'm doing complex History management and front-end page-reloads) I do like @ttfkam's method though as its fool-proof!

@TwItChDW

This comment has been minimized.

Show comment
Hide comment
@TwItChDW

TwItChDW Oct 22, 2011

Hmm I'm getting the issue on a remote server as well even when I have changed the host name from localhost to my domain in the less.js file. It works just fine locally though with the imported style sheets.
EDIT
I should note that if I do edit the main .less file the style will reload but the imported ones will not on the remote server

Hmm I'm getting the issue on a remote server as well even when I have changed the host name from localhost to my domain in the less.js file. It works just fine locally though with the imported style sheets.
EDIT
I should note that if I do edit the main .less file the style will reload but the imported ones will not on the remote server

@adityavm

This comment has been minimized.

Show comment
Hide comment
@adityavm

adityavm Nov 4, 2011

Commenting to watch. Ignore.

adityavm commented Nov 4, 2011

Commenting to watch. Ignore.

@neonstalwart

This comment has been minimized.

Show comment
Hide comment
@neonstalwart

neonstalwart Nov 4, 2011

Contributor

@adityavm there is a link under the comments where you can turn on/off notifications. once i've posted this i'll be using that link to turn off notifications for this issue :)

Contributor

neonstalwart commented Nov 4, 2011

@adityavm there is a link under the comments where you can turn on/off notifications. once i've posted this i'll be using that link to turn off notifications for this issue :)

@attaboy

This comment has been minimized.

Show comment
Hide comment
@attaboy

attaboy Nov 7, 2011

https://gist.github.com/1346280 is my current solution to this problem.

attaboy commented Nov 7, 2011

https://gist.github.com/1346280 is my current solution to this problem.

@alejandroiglesias

This comment has been minimized.

Show comment
Hide comment
@alejandroiglesias

alejandroiglesias Dec 27, 2011

This happens to me also in 1.1.5. The script uses localStorage to store the stylesheets. Clearing your browser cache won't work. You must clear it's cookies (logging off all your accounts, %!@^#%) or doing localStorage.clear(). I use this before loading less.js (not using localStorage myself):

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

When going to production you just compile the stylesheets to .css
Hope it helps.

This happens to me also in 1.1.5. The script uses localStorage to store the stylesheets. Clearing your browser cache won't work. You must clear it's cookies (logging off all your accounts, %!@^#%) or doing localStorage.clear(). I use this before loading less.js (not using localStorage myself):

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

When going to production you just compile the stylesheets to .css
Hope it helps.

@pascalpp

This comment has been minimized.

Show comment
Hide comment
@pascalpp

pascalpp Feb 22, 2012

cloudhead#72 was marked as a duplicate of this issue, but the above issue doesn't appear to address the less.watch() aspect of the problem, as far as i can tell. Is there a way to get less.watch to recompile when an imported file is changed?

cloudhead#72 was marked as a duplicate of this issue, but the above issue doesn't appear to address the less.watch() aspect of the problem, as far as i can tell. Is there a way to get less.watch to recompile when an imported file is changed?

@Thinkscape

This comment has been minimized.

Show comment
Hide comment
@Thinkscape

Thinkscape May 10, 2012

This issue is still present in latest version of less.js. The caching sometimes works correctly, many times it fails to refresh stylesheets even if files are changed on the server. Couldn't narrow down source of the issue though.

This issue is still present in latest version of less.js. The caching sometimes works correctly, many times it fails to refresh stylesheets even if files are changed on the server. Couldn't narrow down source of the issue though.

@vjsingh

This comment has been minimized.

Show comment
Hide comment
@vjsingh

vjsingh Jul 23, 2012

+1 This essentially renders watching useless, since any decently sized project will use @imports

vjsingh commented Jul 23, 2012

+1 This essentially renders watching useless, since any decently sized project will use @imports

@domarmstrong

This comment has been minimized.

Show comment
Hide comment
@domarmstrong

domarmstrong Jul 24, 2012

Having just split out our less into separate files due to unwieldy length, I now regret it.. any news on watch refreshing imported files? Loving less though. Thanks

Having just split out our less into separate files due to unwieldy length, I now regret it.. any news on watch refreshing imported files? Loving less though. Thanks

@lukeapage

This comment has been minimized.

Show comment
Hide comment
@lukeapage

lukeapage Jul 24, 2012

Member

haven't seen a pull request for it so it is unlikely to be very soon.

Member

lukeapage commented Jul 24, 2012

haven't seen a pull request for it so it is unlikely to be very soon.

@vjsingh

This comment has been minimized.

Show comment
Hide comment
@vjsingh

vjsingh Jul 24, 2012

As said before, it works if you just do "less.env = 'development';" before calling less.watch()

vjsingh commented Jul 24, 2012

As said before, it works if you just do "less.env = 'development';" before calling less.watch()

@Thinkscape

This comment has been minimized.

Show comment
Hide comment
@Thinkscape

Thinkscape Jul 24, 2012

As said before, it works if you just do "less.env = 'development';" before calling less.watch()

This breaks other things.

As said before, it works if you just do "less.env = 'development';" before calling less.watch()

This breaks other things.

@jsnewbee

This comment has been minimized.

Show comment
Hide comment
@jsnewbee

jsnewbee Aug 2, 2012

Hi!
I am new bee in JS. I tried to write "less.env = 'development';" before calling less.watch() in my file. But cache for IE dosen't reload the less file even if I changed the file. Please help me & thanks in advance...

jsnewbee commented Aug 2, 2012

Hi!
I am new bee in JS. I tried to write "less.env = 'development';" before calling less.watch() in my file. But cache for IE dosen't reload the less file even if I changed the file. Please help me & thanks in advance...

@colonelchlorine

This comment has been minimized.

Show comment
Hide comment
@colonelchlorine

colonelchlorine Sep 10, 2012

holy hell this drove me nuts.

holy hell this drove me nuts.

@casio

This comment has been minimized.

Show comment
Hide comment
@casio

casio Sep 14, 2012

less.env = 'development';
less.watch();

Does not fix watching @imported files for me.
+1 on watch() being rather useless due to this

casio commented Sep 14, 2012

less.env = 'development';
less.watch();

Does not fix watching @imported files for me.
+1 on watch() being rather useless due to this

@ryanschmidt

This comment has been minimized.

Show comment
Hide comment
@ryanschmidt

ryanschmidt Sep 18, 2012

+1 on watch() being useless without watching import'd files :(

+1 on watch() being useless without watching import'd files :(

@damarusama

This comment has been minimized.

Show comment
Hide comment
@damarusama

damarusama Sep 19, 2012

Wow it's been 2 years since this bug is out and nothing has come out of this?

Most of the work around still needs you to refresh the pages, which defeat the purpose of watch on the first place..

+1 for me too, everything in less is @import for me, so if I can't watch this the live watch mode is kind of useless.

Wow it's been 2 years since this bug is out and nothing has come out of this?

Most of the work around still needs you to refresh the pages, which defeat the purpose of watch on the first place..

+1 for me too, everything in less is @import for me, so if I can't watch this the live watch mode is kind of useless.

@wkarpeta

This comment has been minimized.

Show comment
Hide comment
@wkarpeta

wkarpeta Sep 20, 2012

Also +1. Such a huge bug shouldn't wait 2 years to be resolved.

Also +1. Such a huge bug shouldn't wait 2 years to be resolved.

@lukeapage

This comment has been minimized.

Show comment
Hide comment
@lukeapage

lukeapage Sep 20, 2012

Member

If you help debug the issue and find the exact problem or come up with a way of solving it, it will be fixed much quicker :) Welcome to open source - less.js is not supported by any companies or paid employees.

Member

lukeapage commented Sep 20, 2012

If you help debug the issue and find the exact problem or come up with a way of solving it, it will be fixed much quicker :) Welcome to open source - less.js is not supported by any companies or paid employees.

@damarusama

This comment has been minimized.

Show comment
Hide comment
@damarusama

damarusama Sep 20, 2012

Your condescending comment doesn't help either - I am just starting to use less.js and this bug seems to be a major concept flaw, or at least a flaw at the heart of what I wanted to use less for -
as a work around I work with one file at a time, which seems like a huge waste of time, but makes the watch work

Your condescending comment doesn't help either - I am just starting to use less.js and this bug seems to be a major concept flaw, or at least a flaw at the heart of what I wanted to use less for -
as a work around I work with one file at a time, which seems like a huge waste of time, but makes the watch work

@lukeapage

This comment has been minimized.

Show comment
Hide comment
@lukeapage

lukeapage Sep 20, 2012

Member

but maybe someone will read my comment and help fix this.

Its pretty demoralising to spend 6 days of your personall time fixing things for other people and then read comment after comment criticising that one particular bug or feature has not been looked at. It reads as criticising the people who do actually do things. All I'm saying is that if you like less and find a bug you don't like - help out a bit and everyone will be happy.

Member

lukeapage commented Sep 20, 2012

but maybe someone will read my comment and help fix this.

Its pretty demoralising to spend 6 days of your personall time fixing things for other people and then read comment after comment criticising that one particular bug or feature has not been looked at. It reads as criticising the people who do actually do things. All I'm saying is that if you like less and find a bug you don't like - help out a bit and everyone will be happy.

@tarcon

This comment has been minimized.

Show comment
Hide comment
@tarcon

tarcon Oct 15, 2012

Is there a technical reason for why the client-side less.watch() functionality is not import aware?

Expected behaviour: a client-side recompile process is triggered when the main less file or other less files imported by the main file are modified.

Current behaviour: recompile process is only triggered for main less file, imports are not being watched.

tarcon commented Oct 15, 2012

Is there a technical reason for why the client-side less.watch() functionality is not import aware?

Expected behaviour: a client-side recompile process is triggered when the main less file or other less files imported by the main file are modified.

Current behaviour: recompile process is only triggered for main less file, imports are not being watched.

@Soviut

This comment has been minimized.

Show comment
Hide comment
@Soviut

Soviut Oct 15, 2012

@agatronic Welcome to open source development, aka: Ego Driven Development (EDD). You can't expect everyone to help since not everyone can afford the time or has the technical expertise; This is a CSS pre-processor that many web DESIGNERS, not developers, are using, after all.

Likewise, you can't expect users to be sympathetic just because this is open source. The harsh reality is, normal users need things to work and they don't care if it's proprietary or open source, so the best thing to do is take the criticism in stride. They're giving you the same feedback they'd give anyone else, paid or otherwise.

Accept the criticism as constructive or your ego will be bruised and you'll give up; Why do you think so many open source projects are abandoned?

Soviut commented Oct 15, 2012

@agatronic Welcome to open source development, aka: Ego Driven Development (EDD). You can't expect everyone to help since not everyone can afford the time or has the technical expertise; This is a CSS pre-processor that many web DESIGNERS, not developers, are using, after all.

Likewise, you can't expect users to be sympathetic just because this is open source. The harsh reality is, normal users need things to work and they don't care if it's proprietary or open source, so the best thing to do is take the criticism in stride. They're giving you the same feedback they'd give anyone else, paid or otherwise.

Accept the criticism as constructive or your ego will be bruised and you'll give up; Why do you think so many open source projects are abandoned?

@DomBlack

This comment has been minimized.

Show comment
Hide comment
@DomBlack

DomBlack Oct 16, 2012

I just found this pull request which solves the issue; #776

I just found this pull request which solves the issue; #776

@davidgiven

This comment has been minimized.

Show comment
Hide comment
@davidgiven

davidgiven Jan 7, 2015

This still seems to be an issue in the version in the CDN linked to from the front page.

This still seems to be an issue in the version in the CDN linked to from the front page.

@omidify

This comment has been minimized.

Show comment
Hide comment
@omidify

omidify Apr 25, 2015

5 years later, still an issue. grumble

omidify commented Apr 25, 2015

5 years later, still an issue. grumble

@vikassriv14

This comment has been minimized.

Show comment
Hide comment
@vikassriv14

vikassriv14 Nov 18, 2015

It is still not fixed.

It is still not fixed.

@Emerson

This comment has been minimized.

Show comment
Hide comment
@Emerson

Emerson Jul 12, 2016

Any movement on this? First time I've used less (coming from stylus and scss) and running into this problem.

Emerson commented Jul 12, 2016

Any movement on this? First time I've used less (coming from stylus and scss) and running into this problem.

@matthew-dean

This comment has been minimized.

Show comment
Hide comment
@matthew-dean

matthew-dean Jul 12, 2016

Member

Regarding recent comments: this is something that was addressed and fixed. If there is a new issue (or a reversion), this should be opened as a separate issue that explains the problem.

That is, in "development mode", and assuming you are compiling in the browser, it should not cache the files and compile every time. Otherwise, it will only refresh the files if the main .less file has changed. Is there a behavior being seen that falls outside of this? If so, open a new issue.

Member

matthew-dean commented Jul 12, 2016

Regarding recent comments: this is something that was addressed and fixed. If there is a new issue (or a reversion), this should be opened as a separate issue that explains the problem.

That is, in "development mode", and assuming you are compiling in the browser, it should not cache the files and compile every time. Otherwise, it will only refresh the files if the main .less file has changed. Is there a behavior being seen that falls outside of this? If so, open a new issue.

@davidgiven

This comment has been minimized.

Show comment
Hide comment
@davidgiven

davidgiven Jul 12, 2016

For correct behaviour, it needs to refresh the files if any .less file has changed --- just the main one won't do.

For correct behaviour, it needs to refresh the files if any .less file has changed --- just the main one won't do.

@hermandsen

This comment has been minimized.

Show comment
Hide comment
@hermandsen

hermandsen Aug 31, 2017

Workaround hack for browser caching:

In function FileManager.prototype.loadFile:
Before calling this.doXHR insert
var cacheFreeUrl = href + (href.indexOf('?') === -1 ? '?' : '&') + '_lessWatchRequestTime=' + Date.now();
Now replace this.doXHR(href, ... with this.doXHR(cacheFreeUrl, ...

Has not been tested with external urls, images and urls with #.

Workaround hack for browser caching:

In function FileManager.prototype.loadFile:
Before calling this.doXHR insert
var cacheFreeUrl = href + (href.indexOf('?') === -1 ? '?' : '&') + '_lessWatchRequestTime=' + Date.now();
Now replace this.doXHR(href, ... with this.doXHR(cacheFreeUrl, ...

Has not been tested with external urls, images and urls with #.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment