CSSEdit-like live editing of Sass / LESS without CMD-S?

I really would like to switch to a CSS preprocessor like Sass or LESS, but I'm too used to my current setup and have not seen any solutions that exist for me. Whether there is a?

I am currently using CSSEdit on Mac, which is a live CSS editor. Every time people talk about it, it seems like they think that β€œlive” means that the page reloads every time you save the file. This is not what I mean. If I type CSS in CSSEdit, the changes are displayed as I-type, without saving the file. This is such a time saver, especially if you use the trial version and the error to solve, for example. how many pads to put on an item or try different colors.

So, all the Sass or LESS parameters seem to write Sass / LESS, press CMD + S , the page reloads, and you see your changes. This is not enough for me. Is there anything I can do?

To complicate matters even further, CSSEdit has now abandoned its developer in favor of Espresso, which I have not yet moved, because it still does not have some functions that I am dependent on (setting up code reformatting for one).

+6
source share
3 answers

LiveReload to the rescue!

I do not think that you will find a solution that does not require saving the file.

+1
source

Support for LESS syntax in different editors is still small, so it will take time before such complex functions exist.

It requires the editor to compile every time the file is changed, and that would be ineffective to compile when entering a letter ... so maybe it should compile when there is a valid syntax (compiled without errors) ... which cannot do so " alive. " It can be compiled in CSS or using less.js, perhaps the latter may be better suited for this purpose (no need to use external software). Head over to the Sublime Text plugin development and maybe write such a plugin? :) Sublime Text is the best editor I've used, also because of its flexibility when it comes to plugins. So maybe?

Otherwise, you will have to continue to use CSSEdit and edit live CSS as you described, and then just copy the modified code into LESS files - remember that any CSS is valid LESS . I do the same in Safari / Chrome Inspector or Firebug and then apply the changes to .less files. Not perfect, but it works.

+1
source

In my opinion, this project looks really promising: https://developers.google.com/chrome-developer-tools/docs/css-preprocessors

0
source

Source: https://habr.com/ru/post/909258/


All Articles