How to use Ant to concatenate CSS files from external CSS @import file

Question

How can I use Ant to concatenate a list of CSS files, specified in 1 external CSS file with @imports?

The CSS file that specifies css files and file order looks like this:

 @import url('header.css');
 @import url('footer.css');
 @import url('module/module1.css');
 @import url('module/module2.css');

I want Ant to load and concat all files specified in the css into a single file. Is this possible?

martin clayton · Accepted Answer · 2013-01-06 11:05:28Z

3

You can do this using an Ant loadfile task, followed by a concat.

Here's an example, the linecontainsregexp might be optional, if your css file with the import statements contains only import statements, with one per line. (If that css file is more complex, then the below will need refinement.)

<loadfile property="master.css" srcfile="master.css">
    <filterchain>
        <linecontainsregexp>
            <regexp pattern="@import url" />
        </linecontainsregexp>
        <replaceregex pattern=".*'(.*)'.*" replace="\1," />
        <striplinebreaks/>
    </filterchain>
</loadfile>

The result of that is a property containing a comma-delimited list of the css files in the required order. An Ant filelist can then be used to specify them in the concatenation:

<concat destfile="all.css">
    <filelist files="${master.css}" />
</concat>

answered Jan 6, 2013 at 11:05

martin clayton

78.7k33 gold badges220 silver badges201 bronze badges

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

1 Comment

Pelle Over a year ago

Works amazingly well. A million thanks! You also just solved another "impossible" problem; that a fileslist (that is a real file) seems not respect order when concatenating. Putting the fileslist as a comma separated property variable is clever.

Collectives™ on Stack Overflow

How to use Ant to concatenate CSS files from external CSS @import file

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related