svg-sprite / gulp-svg-sprite

SVG sprites & stacks galore — Gulp plugin wrapping around svg-sprite that reads in a bunch of SVG files, optimizes them and creates SVG sprites and CSS resources in various flavours
MIT License
648 stars 43 forks source link

SyntaxError: Unexpected identifier #64

Closed MatthieuScarset closed 8 years ago

MatthieuScarset commented 8 years ago

Hi,

I got this error when I run my gulp task: node_modules/gulp-svg-sprite/node_modules/svg-sprite/node_modules/svgo/plugins/cleanupIDs.js:123 for (var ID of referencesIDs) { SyntaxError: Unexpected identifier

The issue targets the of statement of 'for .. of)

I'm using npm version 2.15.1 and here's my gulpfile:

var gulp  = require('gulp'),
    svgSprite = require('gulp-svg-sprite');

// Settings SVG
// @see https://github.com/jkphl/gulp-svg-sprite
var svgConfig = {
  mode: {
    css: {
      render : {
        scss : {
          dest : '../assets/scss/base/_svg'
        }
      }
    },
    symbol: { 
        dest: 'templates/sprite', 
        sprite: 'sprite.svg', 
        example: true
    }
  },
  svg: {
    xmlDeclaration: false,
    doctypeDeclaration: false
  }
};

// Tasks
gulp.task('default',['build-svg']); 
gulp.task('build-svg', function() {
  return gulp.src('assets/icons/*.svg')
    .pipe(svgSprite(svgConfig))
    .pipe(gulp.dest('.'));
});
jkphl commented 8 years ago

@MatthieuScarset As the error message states, this is a problem with [SVGO](), not (gulp-)svg-sprite, and it's impossible to debug without the original SVG files you are using. Please isolate and test each single one of them. The error message states that one of your SVG files uses an ID value that's incompatible with SVGO so please dig into that first. Thanks!

MatthieuScarset commented 8 years ago

@jkphl Thank you for your answer.

I've isolated my SVG files and test each one of them. Here's one of my SVG files: https://gist.github.com/MatthieuScarset/e83f51978c54f1255b5cc9c96b560f8c

They all end up with the isame issue so I suppose it's not related to my file content.

When I delete node_modules and reinstall them with npm install I have the following warning: npm WARN engine gulp-svg-sprite@1.3.6: wanted: {"node":">= 4.0"} (current: @{"node":"0.10.46","npm":"2.15.1"})

Does it helps you understand what could be wrong with gulp-svg-sprite / SVGO ?

jkphl commented 8 years ago

@MatthieuScarset Oh well, that makes sense. You're using a pretty old Node version, that neither SVGO (>=0.12.0) nor svg-sprite (>= 4.0) officially supports any longer. Please update your Node installation first before we get deeper into the issue. Thanks.

MatthieuScarset commented 8 years ago

I'll try to update to node >= 4.0 then. Unfortunately I'm stuck on a CentOS 6 machine... Thanks for your answer @jkphl and for the great npm package! You may close this issue :wink:

jkphl commented 8 years ago

@MatthieuScarset Thanks a lot. :) If you don't mind I'll leave the issue open until we definitely know that your Node version is the problem, ok?!

MatthieuScarset commented 8 years ago

@jkphl I have unfortunately no way to update to node >=4.0

Therefore, i'm using gulp-svg-sprite v1.2.19 which use an older version of svg-sprite, which required an older version of svgo compatible with my environnement.

This solved my issue.

I wish CentOS 6 will provide us with an updated version of NodeJS one day :smile:

jkphl commented 8 years ago

@MatthieuScarset I'm sorry for you, but at least this proves that it's a version issue and not a "bug" in any of the packages. Good luck with your project (and CentOS)!