Sage 8.5.1 - gulp error when compiling

sage
,
1

Hi Everyone!

I’m fairly new to Sage/Gulp and I’m running into an error when compiling gulp. Here’s what I’m using:
Sage: 8.5.1
Node: v4.4.2
Bower: 1.7.9
npm: 2.15.0
imagemin-svgo@5.2.1
gulp-imagemin@3.2.0

Everything compiles great up until I reach fonts, then the following error is thrown:

[11:09:39] Finished 'scripts' after 2.98 s
[11:09:39] Starting 'fonts'...
[11:09:39] Starting 'images'...
[11:09:39] Finished 'fonts' after 187 ms

events.js:141
      throw er; // Unhandled 'error' event
      ^
TypeError: this is not a typed array.
    at Function.from (native)
    at /Users/nehaghalke/Documents/Websites/asahouston.dev/wp-content/themes/asahouston/node_modules/gulp-imagemin/node_modules/imagemin-svgo/index.js:25:19
    at optimizeOnceCallback (/Users/nehaghalke/Documents/Websites/asahouston.dev/wp-content/themes/asahouston/node_modules/gulp-imagemin/node_modules/imagemin-svgo/node_modules/svgo/lib/svgo.js:44:17)
    at /Users/nehaghalke/Documents/Websites/asahouston.dev/wp-content/themes/asahouston/node_modules/gulp-imagemin/node_modules/imagemin-svgo/node_modules/svgo/lib/svgo.js:65:9
    at Object.sax.onend (/Users/nehaghalke/Documents/Websites/asahouston.dev/wp-content/themes/asahouston/node_modules/gulp-imagemin/node_modules/imagemin-svgo/node_modules/svgo/lib/svgo/svg2js.js:156:13)
    at emit (/Users/nehaghalke/Documents/Websites/asahouston.dev/wp-content/themes/asahouston/node_modules/gulp-imagemin/node_modules/imagemin-svgo/node_modules/svgo/node_modules/sax/lib/sax.js:640:35)
    at end (/Users/nehaghalke/Documents/Websites/asahouston.dev/wp-content/themes/asahouston/node_modules/gulp-imagemin/node_modules/imagemin-svgo/node_modules/svgo/node_modules/sax/lib/sax.js:683:5)
    at Object.write (/Users/nehaghalke/Documents/Websites/asahouston.dev/wp-content/themes/asahouston/node_modules/gulp-imagemin/node_modules/imagemin-svgo/node_modules/svgo/node_modules/sax/lib/sax.js:991:14)
    at Object.SAXParser.close (/Users/nehaghalke/Documents/Websites/asahouston.dev/wp-content/themes/asahouston/node_modules/gulp-imagemin/node_modules/imagemin-svgo/node_modules/svgo/node_modules/sax/lib/sax.js:157:38)
    at module.exports (/Users/nehaghalke/Documents/Websites/asahouston.dev/wp-content/themes/asahouston/node_modules/gulp-imagemin/node_modules/imagemin-svgo/node_modules/svgo/lib/svgo/svg2js.js:169:28)

Here’s what I’ve tried:

  • Downgrading the imagemin-svgo to 5.2.0 - didn’t seem to help
  • Uninstalling and reinstalling the node_modules and bower_components
  • Doing a clean install with sage, getting gulp up and running just great, then adding the theme files ( excluding gulp-file.js / node_modules / bower_components folders (This one I actually had a lot of hope for, but my spirits were crushed when the error returned)

Please let me know what else I can try to resolve the issue. I look forward to the unleashing of your wealth of knowledge. Thank You!

2

First, please see here: Imagemin issue

You say that it works out of the box without any customizations?

What have you done to customize the theme assets?

Here’s what I would do:

  1. Remove all contents of assets/images/ and assets/fonts/ and attempt another build; if it succeeds then begin adding those assets back one file at a time to find any problematic files
  2. If #1 doesn’t work then remove all custom files again but instead of adding them all back add them back one by one, testing whether the build will work after each add
1 Like
3

@cfx Yes! Thank you!

That is a great approach for debugging the issue that I simply hand’t considered. I’ve used this method when debugging code I just didn’t consider how the error was speaking to me without saying anything specific at a glance.

After removing the images from the assets > images folder I discovered that It looks like I can’t put svg files in there. Removing the svg file resolved the issue completely, I was able to successfully run gulp and continue on my project. I did some digging at first to try to avoid creating duplicate posts, so I apologize if this appears to cover a similar topic.

Thank you for your help!

4

I put SVG files in assets all the time without issues so you may want to double check that the SVGs are formatted correctly. That could be as simple as opening them up in an SVG editor and simply re-saving them but I’ve never experienced an issue like you describe with SVGs. You might also check the svgo repo for issues reported with certain SVG parameters.

If they’re SVGs from font files then you may want to try regenerating them.

1 Like