SVG images ending up under fonts

[JvanderHeide]

Using a bower plugin. SVG image could not be found because it appears in globs.fonts instead of globs.images. Anyway to make sure only SVG fonts go to fonts and SVG images go to images?

--- Want to back this issue? **[Post a bounty on it!](https://www.bountysource.com/issues/13492928-svg-images-ending-up-under-fonts?utm_campaign=plugin&utm_content=tracker%2F8853550&utm_medium=issues&utm_source=github)** We accept bounties via [Bountysource](https://www.bountysource.com/?utm_campaign=plugin&utm_content=tracker%2F8853550&utm_medium=issues&utm_source=github).

[JvanderHeide]

For now I'm using this work around, although it's not ideal. And the .SVG still ends up in my fonts folder as well. [...]

    "images": {
      "files": [
        "../bower_components/photoswipe/dist/default-skin/default-skin.svg",
        "images/**/*"
      ]
    }

[...]

[escobar022]

There also seems to be an issue with .gif types. i used this workaround but it was also and issue with the package set up itself. #27

[austinpray]

Been thinking about this. Pretty sure I'm going to have it read the SVG real quick and determine if it's a font from the content of the SVG. I'll probably make a separate npm module to do this.

[JvanderHeide]

@austinpray just recently used something like that to check for SVG fonts vs SVG images:

var _      = require('lodash');
var filter = require('gulp-filter');
var gulp   = require('gulp');

// Check for "<font id" string in given file
function isSVGFont(file) {
  return file.contents.toString().indexOf('<font id') > -1;
}

// Fonts
return gulp.src(fonts)
.pipe(filter(function(file){
  if(_.endsWith(file.path, '.svg')) {
    return isSVGFont(file);
  } else {
    return true;
  }
}))
.pipe( // Continue pipe...

// Images
return gulp.src(images)
.pipe(filter(function(file){
  if(_.endsWith(file.path, '.svg')) {
    return !isSVGFont(file); // <-- Inverting the returned boolean here
  } else {
    return true;
  }
}))
.pipe( // Continue pipe...

Despite that I'm not using asset-builder in this case (using NPM over Bower) I figured it might still be of interest to you.

[austinpray]

The lazyweb delivers! Thank you @JvanderHeide.

[leehambley]

Just ran into the same problem, I notice that types.json is also incomplete, no .svg (or .tiff, etc) in the images key, and the fonts seems a little broad. MIME type detection might have been more correct, but I'm not sure whether there are different mime types for SVG fonts/images (as they are one and the same).