I have a .less files directory with:
main.less (just import the dependencies)
dep1.less
dep2.less
etc.
I want that modifying a dependency triggers the compilation of the main.less file ONLY.
For now here is my configuration in WebStorm Less watcher. What scope and arguments I need?
Thx to #LazyOne comments I manage to find the right settings.
set the watch scope to the entire folder
put ../$FileNameWithoutExtension$.css at the end of less command arguments
uncheck Create output file from stdout causing empty output file (don't know why)
check Track only root files. Which is not very explicit in my case. Indeed it does not really watch the root file but all the #import dependencies and ONLY COMPILE THE ROOT FILE.
If you prefix your partial files with an underscore
(_dep1.less,_dep2.less)
they wont be compiled. And that doesn't even effect how you call them: #import _dep1.less will import _dep1.less.
Related
I have a style.sass file that #uses several _*.sass partials. That was all working fine. Now I added a _*.scss file (it just contains a map, so I wanted it to be multiline), but editing that file does not trigger a rebuild of the style.sass file. I tried adding a SCSS file watcher too, since I'm not sure how IntelliJ decides what to watch, but that didn't help.
It works fine using Dart-SASS's --watch argument. How do I make IntelliJ do the same?
(Although it's a Play project, I'm using IntelliJ's file watchers because I wanted to be able to use #use, so I needed Dart SASS.)
The watcher can only listen to changes in files of same type (either SASS or SCSS), depending on the watcher settings, so you can't make the watcher work for both .scss and .sass files at the same time unless you use a custom scope with both .sass and .scss files included and set File Type: to Any:
Bottom line I need lessc to compile my main.less file to $CATALINA_EC_TMP/main.css
I'm working on this project, where I need to generate multiple output css files originating from the same source (LESS file) using LESSC.
So with Jet Brain's (WebStorm or IntelliJ Idea) File Watcher, I don't get much of options to save the output files to a custom path using an environment variable.
The reason why I use an environment variable is because some of the outputted files is in a temporary path (it changes whenever I deploy with ant)
That said ...
This is my Environment Variable:
$CATALINA_EC_TMP = '/foo/bar/'
and it's changing so in the next deployment, it won't be /foo/bar/ anymore.
and this is the command line that's being executed by my IDE to compile less files
/usr/local/bin/lessc --no-color main.less
I need lessc to compile my main.less file to $CATALINA_EC_TMP/main.css
so the resulting file would be in that case /foo/bar/main.css or wherever the $CATALINA_EC_TMP value is.
I hope that there's a solution to this, anyway if it doesn't exist I think I'll use fswatcher to copy my generated css files into my destinations whenever I compile.
I have a project under CMake with some files generated with python generator from XML files. I cannot specify all files generated by this generator in CMakeLists.txt so I use file globbing for this.
The problem is that when I update my XML files or generator sources (which are in the same repository) I would like to have my build system reconfigured so changed files are taken into account when rebuilding the code (via make for example).
Is it possible to make CMake treat some files like it treats CMakeLists.txt files and to make it regenerate build system when those file are changed?
It doesn't require any kind of workarounds. The standard way is to use CMAKE_CONFIGURE_DEPENDS property:
set_property(DIRECTORY APPEND PROPERTY CMAKE_CONFIGURE_DEPENDS <filename>)
Yes, you should be able to do that by (ab)using configure_file(). Configuring a file makes the source a dependency of the CMake run, so that any changes in it cause a reconfiguration. Simply like this:
configure_file(MyInputFile.xml DummyOutput.xml)
Since it has been a while I will add to #roolebo's answer.
There's actually a better command to add a dependency on a file:
set_directory_properties(PROPERTIES CMAKE_CONFIGURE_DEPENDS <relative_or_full_path_to_file>)
What might be confusing is that this command adds a property to the current directory. Well, it does not matter since you can set a full path to a file that resides outside of the current directory's scope, for instance: ../../config.json
Let's say I separate a less files into many less files to be easy to organize.
Here is my repository:
/reset.less
/variables.less
/mixins.less
/main.less
/styles.less
The styles.less is just importing the other files:
#import "reset.less";
#import "mixins.less";
#import "variables.less";
#import "main.less";
However, when I add some codes into main.less and use the #line-color which is defined in the variables.less. It shows Name Error: variable #line-color is undefined and I cannot compile it- I use PHPStorm with less plugin.
Could you pleas suggest me?
You have to import your variables.less to all files which use your variables.
Edit:
You have to compile only your style.less. You cannot compile the main.less because it doesn't know the variables.less but you don't want a main.CSS anyway, do you?
You should get the correct style.css which is (I guess) the only css file you'll need.
I could solve it by doing the following in PHPstorm:
Open Preferences…
In Tools > File Watchers > Less (configure)
Check "track only root files"
Change the "Output paths to refresh" to ../css/$FileNameWithoutExtension$.css (added "../css/" in front - depending on what folder you'd like to write the css files into)
(At this point you may want to check if this already does the job to your liking. If it doesn't, carry on to the next step…)
In Other Settings > LESS Profiles > (Your profile) (configure)
Define "LESS source directory": /Users/macuser/htdocs/MySite/sites/all/themes/mytheme/less (depending on which folder contains the .less files)
Define "Include file by path": /Users/macuser/htdocs/MySite/sites/all/themes/mytheme/less/style.less (file name depending on which .less file compiles the other .less files)
Add "CSS output directory" by selecting the folder you wish to write the (minified) CSS files
Enable Compress CSS output if desired
Notice: If Compress CSS output is enabled, this means that the code will be compressed everytime you right-click a .less-file and hit "Compile to CSS". By default the output will not be compressed with every modification you make to the .less-file. If you do want to compress the CSS straight away,
Install less-plugin-clean-css using the following command in
Terminal: sudo npm install -g less-plugin-clean-css
Next, go to Tools > File Watchers > Less (configure), and change the "Arguments" to --clean-css --no-color $FileName$ (added "--clean-css" in front).
Now it will compile your CSS automatically while you're coding. You'll no longer need to compile manually.
I'm trying to separate my CSS files by moving variables + mix-ins to a new CSS file. I'm also using MVC 4 site hosted in Azure if that is an issue.
At the very top of my CSS file that uses the mix-ins, I have:
#import "theme.less.css";
However, it doesn't load it. The error I get is:
variable #defaultColour is undefined on line 166 in file 'styles.less.css'
It is clear that theme.less.css is not being referenced. The documentation for dotless does not mentions the #import statement.
There is an option to treat all imports as less files - otherwise it assumes that because it ends in .css it is imported directly, e.g. not parsed, just shoved in.
When you run the compiler exe without arguments this gives all the options
-a --import-all-less - treats every import as less even if ending in .css
and in the web config
<dotless importAllFilesAsLess="true">
or if you are using your own handler, set the option on the config object.
It is a feature request to handle .less.css files as .less instead of .css and one I've put off a while in case someone is compiling less to .less.css, but I think its something we should add