css - 如何使用 Ant 从外部 CSS @import 文件连接 CSS 文件

Question

如何使用 Ant 连接一个 CSS 文件列表，在 1 个外部 CSS 文件中指定 @imports？

指定css 文件和文件顺序的 CSS 文件如下所示：

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

我希望 Ant 将 css 中指定的所有文件加载并连接到一个文件中。这可能吗？

Answer 1

您可以使用 Antloadfile任务执行此操作，然后使用concat.

这是一个示例，linecontainsregexp如果您的带有 import 语句的 css 文件仅包含 import 语句，每行一个，则可能是可选的。（如果那个 css 文件更复杂，那么下面需要改进。）

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

结果是一个属性，其中包含按所需顺序排列的以逗号分隔的 css 文件列表。filelist然后可以使用Ant在串联中指定它们：

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