Use streamed files instead of src option
Opened this issue · 10 comments
Is it possible to use streamed files instead of src defined in the options? I see in your index.js that you have done so but it seems that I cannot when using it in my gulpfile.. I get this error:
Error: src not defined; please specify your source (src: './img/icons/*.svg').
I would like to run imagemin and some other tasks before this task, then run iconify on those files without saving them temporarily. Something like this:
gulp.task('icons', function () {
return gulp.src(CONFIG.IMG.SRCDIR +'/icons/source/**/*.{svg,png,jpg,gif}')
.pipe($.changed(CONFIG.IMG.DISTDIR +'/icons'))
.pipe($.imagemin({
progressive: true,
svgoPlugins: [
{ removeViewBox: false },
{ removeUselessStrokeAndFill: false }
],
use: [
mozjpeg(),
pngquant(),
gifsicle()
]
}))
.pipe($.iconify({
// pngOutput: './img/icons/png',
cssOutput: CONFIG.CSS.DISTDIR,
svgoOptions: { enabled: false }
}))
.pipe(gulp.dest(CONFIG.IMG.DISTDIR +'/icons'));
});
Let me know what can be done..
Cheers
This could get hairy. Initially I wanted to use the stream/pipe flow, but I decided against it because you can end up screwing up a whole lot of stuff.
For example:
- I'd have to check all the streamed files and only use SVGs
- Are we allowed to overwrite any already existing PNGs with out own generated (fallback) PNGs(currently the plugin is doing that)?
- More importantly: The thing is that this plugin outputs multiple items. Not just 1 processed src file. Not just 1 PNG dest-file. It also has to generate 3 combined CSS files based on all src files. It doesn't fit as a plugin between to other stream-plugins.
If you have any ideas, I'd love to hear them... I kinda ran out of ideas to enable this (in an expected and predictable way).
To be honest, I would prefer putting all files (SVG, png, jpg etc) in the src directory and then have iconify do it's thing on that, just like Grunticon does. As I'm coming from a grunt world, I know how to do things in a certain way so I must have to change my workflow to suit this..
Also, have you seen https://github.com/filamentgroup/grunticon-lib? It looks like Filament Group are making Grunticon into a standalone lib (even though it relies on Grunt under the hood) so maybe we'll be able to use that soon.
One of the perks of Gulp is the streaming pipeline. If that isn't used, you can't wrap gulp-iconify in gulp-plumber for error handling, for example. This is potentially a problem.
@DonGissel: As I stated before, I do agree (and love) the streaming pipe but the thing is: What should the plugin pipe? We've got the raw/processed SVGs, generated PNGs, generated SASS and/or CSS files. I can't pipe it all and if we choose 1 thing I'm absolutely sure somebody would the need 'the other thing'.
I guess something like this should work: https://github.com/twolfson/gulp.spritesmith/tree/2.5.0#continuing-the-pipeline; it just seems kinda complicated (to implement but for usage).
@gavro: for all I care, the plugin could just pass through whatever has been piped into it, like a list of source files or whatever, so it would essentially be "invisible" to the pipeline. The important thing in this case would be that you could use a tool like gulp-plumber to keep your stream alive in case of compiling errors. :-)
@DonGissel okay I get your drift :)
@mrmartineau Will figure something out, eventually!
Well, if this isn't going to use piping than it really isn't a gulp plugin. So one option would be to remove the "gulp-" prefix from the package name to avoid confusion.
@weshardee It'll get in there soon enough; been swamped with other things lately. But the thing is, as @DonGissel says, piping is one of the perks you get with gulp. But it isn't the only one. We've been using this plugin as a separate gulp task in a series of tasks.
Hope to get piping in the plugin soon, sorry, but why all the 'hate' here; as far as I can see it's not that the 'official' gulp version of grunticon is doing a better job at it (https://github.com/filamentgroup/gulpicon) :)
I meant no 'hate' whatsoever. I think this is a fine little bit of code.
A similar naming situation happened with gulp-run-sequence. They dropped the "gulp-" prefix because the functionality provided wasn't gulp specific. I think your package is similar at the moment. It can stand alone without gulp.
gulp-iconify is generating .scss files, ok? In my index.scss I want to have something like
@import "_generated/svg_images/icons.svg";
but I cant because is impossible make running sequence of "iconify -> sass compilation".
Or am I missing something?
Now Iam using workaround with creating empty files for success sass compilation and then async the iconify is done :(