node module/gulp task which takes in svg files, and creates .scss file containing variables for each svg (to later insert as data uris)
{
"name": "generate-icon-sass-vars",
"version": "1.0.0",
"private": true,
"devDependencies": {
"gulp": "^3.8.11",
"gulp-concat": "^2.6.0",
"readable-stream": "^2.0.5"
}
}
var gulp = require('gulp');
var concat = require('gulp-concat');
var iconVars = require('./generateIconVars');
gulp.task('generate-icon-sass-vars', function () {
gulp.src(['icons/status/edit.svg', 'icons/vitals/activity.svg', 'icons/vitals/blood-pressure.svg'])
.pipe(iconVars('$icon-inline-'))
.pipe(concat('_inline-icons.scss'))
.pipe(gulp.dest('scss/common/elements/'))
});
var Transform = require('readable-stream/transform');
module.exports = function (sassVarNamePrefix) {
var eol = '\';\n';
var replacements = [
[/>(\s+)</g, '><'],
[/path/g, 'path fill=\"FillColor\" stroke=\"StrokeColor\"']
];
return new Transform({
objectMode: true,
transform: function (file, enc, callback) {
// pull in the contents of our source file, transform to string
var currentContents = String(file.contents);
// create the variable name
var fileName = sassVarNamePrefix + file.path.match(/([^/]+$)/)[0].split('.')[0] + ': \'';
// run through each of our replacement tasks
replacements.forEach(function (replacement) {
currentContents = currentContents.replace(new RegExp(replacement[0]), replacement[1]);
});
// put it all together
currentContents = fileName + currentContents + eol;
// return our modified content as a buffer
file.contents = new Buffer(currentContents);
// and send it on its way
this.push(file);
return callback();
}
});
};