从 css 个文件中收集字符串并将它们保存到新的 css 个文件中
Collect strings from css files and persist them into new css file
我有一个将几个 css 文件连接成一个文件的过程。
css1.css:
@namespace xlink "http://www.w3.org/1999/xlink";
use[xlink|href="#favorite-icon-svg"] {
fill:#dbdbdb;
fill-opacity:0;
}
css2.css:
body {
background-color: red;
}
css3.css:
@namespace svg url(http://www.w3.org/2000/svg);
svg|a {
text-decoration: none;
}
需要转换成all.css:
@namespace xlink "http://www.w3.org/1999/xlink";
@namespace svg url(http://www.w3.org/2000/svg);
use[xlink|href="#favorite-icon-svg"] {
fill:#dbdbdb;
fill-opacity:0;
}
body {
background-color: red;
}
svg|a {
text-decoration: none;
}
其中一些 css 文件可能包含 @namespace 指令,需要将其放置在使用它的 css 文件的顶部。问题是连接使得一些@namespace 指令被放置在新文件的中间,这破坏了它们的功能。
任务可分为两步:
- 收集所有出现的@namespace 指令并将其放入
单独的 css 文件
- 将所有 css 文件(包括在第一个位置分隔的@namespaces)连接成单个 css 文件
生成的 css 文件将在所有原始文件内容之后的文件开头具有 @namespace 指令。
我无法编写第 1 步,我需要浏览提供的文件列表(在文件集、模式集或包含的定义中定义)查看内容并选择 @namespaces,例如通过一些正则表达式模式。
将找到的@namespaces 放入单独的文件中(这应该是步骤 1 中比较容易的部分)。
有什么建议吗?
这可能是一个合适的起点。
<property name="namespace_file" value="namespaces.css" />
<property name="other_file" value="other.css" />
<property name="all_file" value="all.css" />
<delete>
<fileset dir="." includes="${namespace_file} ${other_file} ${all_file}" />
</delete>
<concat destfile="${namespace_file}">
<fileset dir="css_files" includes="*.css" />
<filterchain>
<linecontainsregexp>
<regexp pattern="^@namespace" />
</linecontainsregexp>
</filterchain>
</concat>
<concat destfile="${other_file}">
<fileset dir="css_files" includes="*.css" />
<filterchain>
<linecontainsregexp negate="true">
<regexp pattern="^@namespace" />
</linecontainsregexp>
</filterchain>
</concat>
<concat destfile="${all_file}">
<fileset dir="." includes="${namespace_file} ${other_file}" />
</concat>
在这个例子中:
- 源 css 文件位于
css_files
目录中。
- 创建了两个工作文件:一个用于命名空间,一个用于 css 的其余部分。
- 使用了两个 Ant
<concat>
任务:一个用于收集命名空间,一个用于其余。
- 每个
concat
使用带有正则表达式的过滤器链。
- 第三个
concat
将收集到的命名空间与 css 的其余部分合并到一个名为 all.css
. 的文件中
我有一个将几个 css 文件连接成一个文件的过程。
css1.css:
@namespace xlink "http://www.w3.org/1999/xlink";
use[xlink|href="#favorite-icon-svg"] {
fill:#dbdbdb;
fill-opacity:0;
}
css2.css:
body {
background-color: red;
}
css3.css:
@namespace svg url(http://www.w3.org/2000/svg);
svg|a {
text-decoration: none;
}
需要转换成all.css:
@namespace xlink "http://www.w3.org/1999/xlink";
@namespace svg url(http://www.w3.org/2000/svg);
use[xlink|href="#favorite-icon-svg"] {
fill:#dbdbdb;
fill-opacity:0;
}
body {
background-color: red;
}
svg|a {
text-decoration: none;
}
其中一些 css 文件可能包含 @namespace 指令,需要将其放置在使用它的 css 文件的顶部。问题是连接使得一些@namespace 指令被放置在新文件的中间,这破坏了它们的功能。
任务可分为两步:
- 收集所有出现的@namespace 指令并将其放入 单独的 css 文件
- 将所有 css 文件(包括在第一个位置分隔的@namespaces)连接成单个 css 文件
生成的 css 文件将在所有原始文件内容之后的文件开头具有 @namespace 指令。
我无法编写第 1 步,我需要浏览提供的文件列表(在文件集、模式集或包含的定义中定义)查看内容并选择 @namespaces,例如通过一些正则表达式模式。 将找到的@namespaces 放入单独的文件中(这应该是步骤 1 中比较容易的部分)。
有什么建议吗?
这可能是一个合适的起点。
<property name="namespace_file" value="namespaces.css" />
<property name="other_file" value="other.css" />
<property name="all_file" value="all.css" />
<delete>
<fileset dir="." includes="${namespace_file} ${other_file} ${all_file}" />
</delete>
<concat destfile="${namespace_file}">
<fileset dir="css_files" includes="*.css" />
<filterchain>
<linecontainsregexp>
<regexp pattern="^@namespace" />
</linecontainsregexp>
</filterchain>
</concat>
<concat destfile="${other_file}">
<fileset dir="css_files" includes="*.css" />
<filterchain>
<linecontainsregexp negate="true">
<regexp pattern="^@namespace" />
</linecontainsregexp>
</filterchain>
</concat>
<concat destfile="${all_file}">
<fileset dir="." includes="${namespace_file} ${other_file}" />
</concat>
在这个例子中:
- 源 css 文件位于
css_files
目录中。 - 创建了两个工作文件:一个用于命名空间,一个用于 css 的其余部分。
- 使用了两个 Ant
<concat>
任务:一个用于收集命名空间,一个用于其余。 - 每个
concat
使用带有正则表达式的过滤器链。 - 第三个
concat
将收集到的命名空间与 css 的其余部分合并到一个名为all.css
. 的文件中