Как добавить отсутствующие свойства объявления CSS и префиксы для браузера в epub

Издатели иногда выпускают заголовки Epub без включения всех необходимых свойств объявления CSS и префиксов для конкретного браузера. Например, заголовок может включать объявление -webkit-transform, но опускать transform или наоборот.

Существует ряд инструментов, помогающих разработчикам в рабочем процессе создания нового контента Stackoverflow: Как автоматически добавлять префикс браузера к свойствам CSS3?; однако я ищу способ проанализировать весь Epub и добавить недостающие свойства.


css emmet epub epub3
person andrew    schedule 23.10.2015    source источник
comment
Пытаюсь понять голос против. Не показывает каких-либо исследований или усилий: вопрос ясно показывает, что я исследовал существующие инструменты. Как это непонятно? Кому это не полезно?   -  person andrew    schedule 23.10.2015
comment
Прогоните вниз, не беспокойтесь об этом. Возможно, downvoter был обеспокоен тем фактом, что вы изначально, казалось, просили инструмент, который не по теме в SO. Однако в таких случаях предпочтительнее проголосовать за закрытие (что он, вероятно, и сделал), а не против. Что бы ни.   -  person    schedule 23.10.2015

Ответы (2)


arrow_upward
1
arrow_downward

Предположим, что весь соответствующий CSS находится в .css файлах. Вы можете открыть epub, разархивировав его, и это откроет доступ к файлам CSS, где бы они ни находились. Затем вы можете просто запустить их через свой любимый инструмент для создания префиксов, а затем заархивировать книгу обратно.

Проблема в том, что инструменты префикса AFAIK обычно ожидают свойство transform и добавляют аналог -webkit-transform. Я не уверен, что эти инструменты будут работать, если есть только -webkit-transform, а вы хотите добавить transform. Вам нужно будет проверить каждый инструмент, чтобы увидеть, обеспечивает ли он такое поведение. В худшем случае вы могли бы написать свой собственный плагин для фреймворка преобразования CSS, например переработать, чтобы делать то, что вам нужно.

person Community    schedule 23.10.2015
comment
Похоже, reworkcss должен помочь. Постараюсь найти способ поделиться своим решением. - person andrew; 23.10.2015

arrow_upward
1
arrow_downward

В итоге решил проблему с помощью postcss с плагинами postcss-unprefix и autoprefixer. 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);
        }
    });
}
person andrew    schedule 04.11.2015