lesscss import and watch - less

I have two files:
black.less
/* imports */
#import "elements.less";
#import "crush.less";
#import "tree.less";
I'm using the less watch functionality by adding:
less.watch();
Sure enough I can see the traffic getting black.less. Black.less hasn't changed though so any change in any of the files being imported is not counted as a change and the style is not updated.
If I however touch black.less the style updates as it should.
Is there a way to automatically update regardless of if it's an imported file or the actual less file being added to the page i.e. so that I only have to change let's say tree.less.
/K

I use Grunt and the grunt-contrib-less plugin to watch all of my less files and compile them into CSS as they change.
Then I use live.js in the browser to watch the CSS files.
The advantage to doing it this way is that I can do the same thing with my HTML and JS files, as well as run tests, lint my JS files, etc.

Remy Sharp recently wrote a post about how newer versions of Chrome support the ability to save files that you edit in the dev tools back to the file system.
He advocates Never having to leave devtools. Just do your edits right in the browser. The advantage to this solution for you is that you could continue to use the client-side Less compiler.
(I still like my robust text editors and command-line too much to ditch them entirely, but thought this answer would likely appeal to at least a few people who arrived at this question.)

Here's another quick way.
watch -n 1 touch black.less

This may be too late for op, but I had the same question and maybe others have it too.
less-watch-compiler will watch a directory (and sub-directories) for changes and compile any less code to a destination folder. The cool bit is that you can specify the main file and only the main file will be compiled when any file in the source directory is changed.
Usage:
less-watch-compiler [options] <source_dir> <destination_dir> [main-file]

Related

What is the best way to flush precompiled perl6 modules?

I am trying to refactor some code. My approach (using vi) is to copy my old libraries from /lib to /lib2. That way I can hack out big sections, but still have a framework to refactor.
So I go ahead and change mymain.p6 header from use lib '../lib'; to use lib '../lib2';. Then I delete a chunk of the lines in ../lib2/mylibrary.pm6 and make darn sure :w is doing what I expect.
Imagine my surprise when my program still works perfectly despite having been largely deleted. It even works when I rm -R /lib, so nothing back there is persisting.
Is there a chance that I have a precomp of the old lib module lying around? If so, how can I flush it?
This is Rakudo Star version 2019.03.1 built on MoarVM version 2019.03
implementing Perl 6.d.
Precompiled modules are stored in the precomp directory. You can try to rename or delete the ~/.precomp directory.
See also this SO question here.
Update. Well I thought I'd replicated the scenario. It was reliably showing the bug during a one hour period. But now it isn't. Which is pretty disturbing. Investigation continues...
I've replicated #p6steve's scenario in case someone wishes to report this as a bug. At the moment I'm with #p6steve (per comment below) in that I'm going to treat this as a DIHWIDT rather than a reportable bug. That said, now we have a golf'd summary.
Original main program using path1 followed by the module it uses directly and then the one that uses:
use lib 'path1';
use lib1;
say $lib1::value;
unit module lib1;
use lib2;
our $value = $lib2::value;
unit module lib2;
our $value = 1;
This displays 1.
If the libs are copied to a fresh directory, including the .precomp directory, and then the lib2 is edited but the lib1 is not, the change to lib2 is ignored.
Here it is on glot.io before and after copying the libs and their .precomp directory and then editing the libs.
Original answer
Thank you for editing your question. That gives us all more to go on. :)
I'd like to try to get to the bottom of it and hope you're willing to have a go too. This (n)answer and comments below it will record our progress.
From your comment on #ValleLukas' answer:
Then I noticed ../lib2/.precomp directory - so realised library precomps are stored in the library folder. That did the job!
Here's my first guess at what happened:
You copied lib en masse to lib2. This copied the precomp directory with it.
You modified the use lib ... statement in mymain.p6 to refer to lib2.
Your mymain.p6 code includes a use module-that-directly-or-indirectly-uses-mylibrary.
You modify mylibrary.pm6.
But nothing changes! Why not?
You haven't touched module-that-directly-or-indirectly-uses-mylibrary, so Rakudo uses the precompiled version of that module from the lib2/.precomp directory.
Speculating...
Perhaps the fact that that precompiled version exists leads the precompilation logic to presume that if it also finds a precompiled version of a module that's used by module-that-directly-or-indirectly-uses-mylibrary then it can go ahead and use that and not even bother to check how its timestamp compares to the source version.
Does this match your scenario? If not, which bits does it get wrong?

is script autoloading possible in rebol or red-lang?

Is there a way to do so ? I searched Google but couldn't find any answer, so I guess the answer would be no. Is there anything close ? If not, would it be easy to extend red-lang to do so ?
From http://www.rebol.com/docs/setup.html
Startup Scripts
When REBOL starts it will automatically run the rebol.r and user.r files, if they exist.
The system looks for these files first in the current directory (or the directory of the script being run), then in the directory that contains the REBOL executable program.
Note that REBOL/Core runs fine without the rebol.r and user.r files. They simply provide an easy way to include additional code and data on startup, such as your network preferences.
If you compile your own Red interpreter you can add an autoloading file, maybe in console.red after system/console/init "Red Console" and before system/console/launch Best advice is to ask on the https://gitter.im/red/help site to ask for help. I guess this was already discussed.

How to open and modify .gtk plugin

I have found a plugin (EELSTools.gtk from http://www.dmscripting.com) which I want to modify.
The plugin contains nearly every function I need, but I want also to integrate some extra functions.
Does anyone know how to open .gtk files?
You can't and shouldn't.
*.gtk files are packages files with the purpose of encapsulation. This might either be because of convenience, but it might as well be, because the author does not want to make the code open-source. (Note that there are some proprietory plugins as well, they are also .gtk files.)
If you have found a plugin and want to expand on it, the best way forward is to contact the plugin-author.
The *.gtk files get loaded before *.s files. If you install your own script from DM Menu Install Script File or Install Script, you can add it to the menu that the *.gtk file has, e.g. EELSTools. It is added at the end of the list. For example, I put a measure ZLP width script in EELSTools.

Can I use Less in my own text editor without compiling?

I would like to start using Less rather than writing CSS from scratch, but is it possible to use Less in such a way that all the following things are true:
I can write Less within my own text editor (TextMate)
I don't have to compile the CSS manually after each edit, but can just save the Less file
my CSS is not reliant on JavaScript (at least not in production).
I've tried to Google the answer to these questions, but I can't figure out a clear answer. Thanks for your help.
The short practical answer
There are several tools out there that help you to compile your LESS into CSS on the fly each time you save your LESS file. Most tools do much more than just compiling LESS, they also come with "live reload" functionality, compile coffeescript, handlebars, SCSS, run JSlint, combine JS, etc.
LESS compile tools selection:
http://gruntjs.com/ < open source, comand line interface
http://koala-app.com/ < GUI, cross platform, free
http://crunchapp.net/ < GUI, cross platform, free, based on AIR
http://wearekiss.com/simpless < GUI, cross platform, free
http://alphapixels.com/prepros/ < GUI, windows, freemium
http://incident57.com/less/ < GUI, Mac, small simple tool, free
http://incident57.com/codekit/ < GUI, Mac, commercial, powerful
https://github.com/Mte90/Plessc < GUI, Linux, free
Please consider project size. most of the tools work really great if you work alone, but for team work you'll need some sort of configuration standard (config file).
When using LESS CSS, you still have to write your css styles from scratch. Not unless you have and use your own css framework. If you use or have as such, you may just have to define your VARIABLE and MIXINS,and your additional custom styles.
Such LESS CSS Framework includes Twitter Bootstrap. You don't have write CSS from scratch when you use it in your font-end development, you only need to add/adjust your own customizations.
You can write LESS with your editor (TextMate). Since LESS file is also a CSS file with an extension of LESS (style.less). Only that your browser cannot parse the LESS file without using LESS in client side (by linking to less.js file in your document head). If you checkout this page, you can see that TexTMate is listed as one of the Editors that supports LESS (It has syntax highlighting).
You don't have to compile LESS to CSS file manually.
When compiling LESS file to CSS file, you have the Command Line compilers and the GUI compilers. When using Command Line compiler, you'll have to use of course your terminal to command the compiling ($ lessc style.less style.css). When you opt to use the Command line option, you'll have to install NPM and Node.js. Install NPM first, before Installing Node.js, since NPM will let you install Node.
You will not rely on JavaScript in production, if using LESS, because you only use LESS during development. You will be using JavaScript (less.js) when you opt to use LESS in Client Side (browser side).
Here are some links that will give more info about LESS Usage http://lesscss.org/#synopsis:
This
This
This
LESS CSS is a CSS Pr-processor just like Sass
Some LESS Examples
Using Variables: Using variables during development, makes your work flow faster. Changing colors is just a breeze using variables.
#black: #000;
#grayDarker: #222;
body {
color: #grayDarker;
background: #black;
}
Read more examples from the given links.

window less compiler that supports "backwards #import parsing

I see that the less.app (on the mac) supports backwards importing
In LESS CSS can I get LESS to watch a bunch of files but compile a different file when they change?
So if I have a global.less that imports an inner less file, it will recompile the global less file, when I change the inner file.
Does anyone know of a way to do this using the less.js in browser compiler? Or is that impossible?
Or probably even better, a windows based compiler that would do this or be able to watch the folder but just compile the global file when any of the folders change.
So far I've tried winless, the less parser and simpless and neither of these will do this. Even if it comiled all the less files to when anything changes in the folder I'd be happy.
Much appreciated!
Support for automatic backwards #import compiling has been added to WinLess in version 1.1.0.