Is there a CSS minifier than can resolve import statements?

Question

Is there a CSS minifier tool that can resolve @import statements?

I'd like to be able to load multiple CSS files on my local machine but have them all resolved into one file when the website gets pushed out into production.

Answer 1

I recently started using LESS, beyond imports allows you to use:

• Variables
• Mixins
• Parametric Mixins
• Nested rules
• Operations
• Color functions
• Namespaces
• Scope
• Comments
• Escaping

So far I'm glad with my experience using LESS.

It's easy to use and the page is documented with good examples.

Answer 2

You can use SASS, with the SCSS syntax. SASS is much more than a minifier: it is actually a CSS preprocessor which adds some goodies like variables or macros to the CSS syntax. But you can choose to simply ignore these features (although I advise you to have a look): any valid CSS file is actually valid SCSS.

SASS can then compile your SCSS in valid CSS, and it can manage multiple files and output a single minified .css file.

You can try it just as a minification tool for now, and start using the advanced features when you feel like experimenting.

Answer 3

css-compressor (based on yuicompressor) inlines @import statements - in fact that is its primary purpose:

https://github.com/samilyak/css-compressor