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

[vicb]

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]

Yea, something I have to look into.

[cloudhead]

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]

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]

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]

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]

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]

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

[t1mmen]

+1

I was tearing my hair out too!

[leobalter]

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]

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

[givankin]

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

[leobalter]

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]

@leobalter I've just been using

less.env = 'development';

is the first part required?

[leobalter]

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]

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

[ttfkam]

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]

@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]

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]

Commenting to watch. Ignore.

[neonstalwart]

@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]

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

[alejandroiglesias]

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]

#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 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]

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

[domarmstrong]

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]

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

[vjsingh]

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

[Thinkscape]

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

This breaks other things.

[jsnewbee]

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]

holy hell this drove me nuts.

[casio]

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

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

[ryanschmidt]

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

[ghost]

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]

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

[lukeapage]

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.

[ghost]

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]

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]

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]

@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]

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

[davidgiven]

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

[omidify]

5 years later, still an issue. grumble

[vikassriv14]

It is still not fixed.

[Emerson]

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

[matthew-dean]

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]

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

[hermandsen]

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 #.