why "postcss.decl is not a function"
kang-lyk opened this issue · 1 comments
kang-lyk commented
`var gulp = require('gulp'),
fileinclude = require('gulp-file-include'),
requireDir = require('require-dir');
var updateRule = require('postcss-sprites/lib/core').updateRule;
var baseUrl = 'http://static.eelly.com/';
gulp.task('css', function () {
var postcss = require('gulp-postcss'),
postcssArr = [
require('autoprefixer')({
browsers: ['last 2 versions', 'Android >= 4.0'],
cascade: false, //是否美化属性值 默认:true 像这样:
//-webkit-transform: rotate(45deg);
//transform: rotate(45deg);
remove:true //是否去掉不必要的前缀 默认:true
}),
require('precss'),
require('postcss-sprites')({
stylesheetPath:'./src/css/',
spritePath:'./src/images/',
basePath:baseUrl,
relativeTo: 'rule',
spritesmith:{
padding:10
},
filterBy: function(image) {
// Allow only png files
if (!/icon\-/.test(image.url)) {
return Promise.reject();
}
return Promise.resolve();
},
hooks: {
onUpdateRule: function(rule, token, image) {
// Use built-in logic for background-image & background-position
updateRule(rule, token, image);
['width', 'height'].forEach(function(prop) {
rule.insertAfter(rule.last, postcss.decl({
prop: prop,
value: image.coords[prop] + 'px'
}));
});
}
}
}),
require('postcss-assets')({
loadPaths: ['./src/images/','../images'],
baseUrl: baseUrl,
cachebuster: true
})
];
return gulp.src(['src/**/*.css','!src/**/_*.css'])
.pipe( postcss(postcssArr))
.pipe( gulp.dest('dist/'));
});`
vvasilev- commented
It's not a function because you use gulp-postcss
instead of postcss
. Please use the code block below.
var gulpPostcss = require('gulp-postcss');
var postcss = require('postcss');