0

出版商有时会发布 Epub 标题而不包括所有必需的特定于浏览器的 css 声明属性和前缀。例如，标题可能包含-webkit-transform声明但省略transform，反之亦然。

有许多工具可用于协助开发人员创建新内容的工作流程Stackoverflow：如何自动将浏览器前缀添加到 CSS3 属性？; 但是，我正在寻找一种方法来解析整个 Epub 并添加任何缺失的属性。

4

2 回答 2

1

我们假设所有相关的 CSS 都在.css文件中。您可以通过解压缩来打开 epub，这将暴露 CSS 文件，无论它们在哪里。然后，您可以简单地通过您最喜欢的前缀工具运行这些，然后将书压缩回来。

问题是 AFAIK 前缀工具通常期望该transform属性并添加-webkit-transform对应项。我不确定如果只有这些工具-webkit-transform存在并且您想transform被添加，这些工具是否会起作用。您必须检查每个工具以查看它是否提供此行为。在最坏的情况下，您可以为 CSS 转换框架编写自己的插件，例如返工来做您需要的事情。

于 2015-10-23T16:44:41.907 回答
1

最终使用带有插件 postcss-unprefix 和 autoprefixer 的 postcss 解决了问题。postcss-unprefix 删除现有的前缀和 autoprefixer 然后添加任何需要的。

var fs = require('fs')
var postcss = require('postcss');

var input = process.argv[2]; // the source of the css
var output = process.argv[3]; // where to write the output

fs.readFile(input, 'utf8', function (err, result) {
    if (err) {
        console.log(err);
        process.exit(1);
    }
    processCss(result, function (err, result) {
        if (err) {
            console.log(err);
            process.exit(1);
        } else {
            fs.writeFileSync(output, result, "utf8");
            process.exit(0);
        }
    })
});


function processCss(cssString, callback) {
    postcss([require('postcss-unprefix'), require('autoprefixer')])
    .process(cssString, { from: 'in.css', to: 'out.css' })
    .then(function ( error, result ) {
        if (result) {
            callback(String.trim(result.css));
        } else {
            callback(null, error);
        }
    });
}
于 2015-11-04T17:49:09.597 回答