Катерина Павленко, Devexperts
Катерина Павленко, Devexperts
spb-frontend plugin hackathon, 29.11.15
Даже если ночью в шкафу завернуться в одеяло и шепнуть «пост-цсс», то с верхней полки всё равно высунется Ситник и скажет, что есть плагин.
— Вадим Макеев (@pepelsbey) 7 ноября 2015
html, body.home {
margin: 10px 20px;
}
type: 'root',
nodes: [
{
type: 'rule',
selectors: 'html, body.home',
nodes: [{
type: 'decl',
prop: 'margin',
value: '10px 20px'
}]
}
]
var postcss = require('postcss');
module.exports = postcss.plugin('PLUGIN_NAME', function (opts) {
opts = opts || {};
// Work with options here
return function (css, result) {
// Transform CSS AST here
};
});
module.exports = postcss.plugin('postcss-carl', function (opts) {
return function (css, result) {
css.walkRules(function(rule) {
rule.selector = rule.selector + ', CARL';
});
};
});
.zombie {
color: red;
}
.zombie, CARL {
color: red;
}
css.walkDecls(function(decl) {
if (decl.prop === 'width') {
var comment = postcss.comment({text: 'Upside down!'});
decl.prop = 'height';
decl.parent.insertBefore(decl, comment);
}
});
console.log() //bad
result.warn(); //good!