Live editing (CSSEdit-like) Sass/LESS without CMD-S? [closed]
https://stackoverflow.com/questions/9426913
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianQuestion
I really would like to switch to a CSS preprocessor like Sass or LESS but I am too accustomed with my current setup and have not seen any solutions that exist for me. Are there any?
I currently use CSSEdit on the Mac which is a live CSS editor. Every time people talk about this they seem to think "live" means that the page reloads every time you save the file. This is not what I mean. If I am typing some CSS in CSSEdit then the changes are shown as-I-type, without having to save the file. This is such a time saver, especially if you are using trial and error to decide eg. how much padding to put on an element or trying out different colours.
So all the Sass or LESS options seem to be, write Sass/LESS, press CMD+S, the page reloads and you see your changes. This is not good enough for me. Is there anything I can do?
To further complicate things, CSSEdit has now been abandoned by its developer in favour of Espresso, which I have not moved to yet because it is still lacking some of the features I depend on (customising the reformatting of code for one).
Solution
LiveReload to the rescue!
I don't think you'll find a solution that does not require you to save the file.
OTHER TIPS
LESS syntax support in various editors is still not wide, so it will take time before such sophisticated functionality will exist.
It would require the editor to compile on every change in file, and this wouldn't be effective to compile when you type a letter... so perhaps it would have to compile when there is valid syntax (compiled without errors)... which may not make it so "live". It could be compiling to CSS or using less.js, perhaps the latter could suit this purpose better (no need to use external software). Head to Sublime Text plugin development and perhaps write such plugin? :) Sublime Text is the best editor I've used, also because of its flexibility when it comes to plugins. So maybe?
Otherwise you'd have to continue to use CSSEdit and do live CSS editing as you described and then simply copy changed code to LESS files - remember that any CSS is valid LESS. I do the same in Safari/Chrome Inspector or Firebug, and then apply changes in .less files. Not ideal but works..
In my opinion, this project looks really promising: https://developers.google.com/chrome-developer-tools/docs/css-preprocessors
