2

I am trying to use LESS CSS to write my CSS. I have imported the style.less and less.js file in that order.

Now i wanna extract the CSS that LESS generates.. is there any way i can do that ? i dont want to use the script to generate it dynamically in production. just for development.

4 Answers 4

5

You can extract the CSS using the Firebug extension in Firefox. The compiled CSS appears under the menu choice "inline" in the CSS tab.

Sign up to request clarification or add additional context in comments.

Comments

3

http://incident57.com/less/ if you're fortunate enough to use OS X, and there's a ruby gem too http://rubygems.org/gems/less although this has been superseded by the node.js implementation installed through npm. Check http://lesscss.org/ for more information.

There's also http://www.dotlesscss.org/ for windows, but not sure how useful it is.

4 Comments

Also: Does Less.js not generate attached CSS at runtime? I've never used it that way, but just assumed it would dynamically create the CSS and add it to the document's head.
its generating the css.. but am not finding any file where the css rules are defined.
Do you have a live page you can inspect? The CSS wont be there when you view -> source, but using developer tools in your browser, if you inspect the document it will be there in some format (not sure if it's inline, or in the head of the document). It probably wont generate a linked file as it's client side. Also: Just realised one of the links was wrong.
thanks .. got the code :) i thought i will generate a diff file with all the css compiled :P
1

And in 2013 we have:

http://less2css.org/

Seems to work just fine for me. Just copy/paste.

Chances are you'll want to minify your CSS after this, so:

http://cssminifier.com/

Comments

0

For others who'd stumble here, in modern browser you can see it in the LocalStorage. I use Chrome and it's in the dev toolbar under Resources. In my case we also want to save the css file automatically (we have a tool that generates a template), we can do it easily with javascript.

This returns the generated CSS, just replace it with the right path, as you see it under the Resources tab: localStorage.getItem('http://domain.com/css/main.less');

Then we send that through Ajax to save it in a css file. When switching to production we remove the less and replace it by the generated css file.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.