Thank you for writing this plugin! It is a very important to move data to a separate file for performance.
Here is my situation. I am running PostCSS with multiple files at a time with Gulp:
gulp.task('css', function () {
var postcss = require('gulp-postcss');
var url = require('postcss-url');
var packer = require('postcss-data-packer');
var processors = [
url({
url: 'inline'
}),
packer({
dataFile: false,
dest: 'main-data.css'
})
];
return gulp.src(['build/css/**/*.css', '!main-data.css'])
.pipe(postcss(processors))
.pipe(gulp.dest('build/css'));
});
There are two problems with this code. First, every data file is named the same thing, main-data.css, so only the last file processed does not get overwritten. Second, this plugin writes empty files if there is no data in the CSS. I'm running this on the same directory, so the next time this gets called, I overwrite my main-data.css file with nothing.
This pull-request allows you to use functions as values for dest.path and dest.map so that you can dynamically build the filename based on the file being processed. It also prevents any blank files from being created.
Now I'm able to write my gulpfile like this:
gulp.task('css', function () {
var postcss = require('gulp-postcss');
var url = require('postcss-url');
var packer = require('postcss-data-packer');
var processors = [
url({
url: 'inline'
}),
packer({
dataFile: false,
dest: {
path: function (opts) {
return path.join('build/css', path.basename(opts.from, '.css') + '.data.css');
}
}
})
];
return gulp.src(['build/css/**/*.css', '!**/*.data.css'])
.pipe(postcss(processors))
.pipe(gulp.dest('build/css'));
});
Thank you for writing this plugin! It is a very important to move data to a separate file for performance.
Here is my situation. I am running PostCSS with multiple files at a time with Gulp:
There are two problems with this code. First, every data file is named the same thing,
main-data.css
, so only the last file processed does not get overwritten. Second, this plugin writes empty files if there is no data in the CSS. I'm running this on the same directory, so the next time this gets called, I overwrite mymain-data.css
file with nothing.This pull-request allows you to use functions as values for
dest.path
anddest.map
so that you can dynamically build the filename based on the file being processed. It also prevents any blank files from being created.Now I'm able to write my gulpfile like this:
Благодарим Вас за это, ура!