Menu icon Foundation

Designer

My Posts

  • 2
    Replies
  • Image causes error in gulp-imagemin

    By Arkarys

    cliemailsimagemin

    When I drop an image in the img directory under src, I receive the following: Error in plugin 'gulp-imagemin:'Message: spawn d:\mail\node_modules\gulp-imagemin\node_modules\imagemin\node_modules\imagemin-jpegtran\node_modules\jpegtran-bin\vendor\jpegtran.... (continued)

    Last Reply by Arkarys over 3 years ago





  • 7
    Replies
  • SVG and Reveal Modal

    By Arkarys

    svg

    I'm, working with SVGs as a perfect alternative for not scalable image maps (old school). I can use links in a SVG and the :hover-pseudoclass. Now I would like to open a reveal modal from a link in a SVG file. Everything is working pretty fine as long as ... (continued)

    Last Reply by Arkarys almost 4 years ago


My Comments

Arkarys commented on Will's post over 3 years

O-oh. I surrender.
Do you know virtualbox? Maybe you install yourself a linux guest and try it there. I tried that successfully, too.
This was, how I found that I had a leading explamation mark in my directory name which made problems for me.
 

Arkarys commented on Will's post over 3 years

Hm, Will, that's weird. Obviously it seems to be a problem with browser-sync
Did you had Foundation 5 installed on your system?
('If you already have the Foundation 5 CLI on your machine, you will only be able to access one of the commands, depending on how your command line environment is configured. If you want to remove the old CLI, run gem uninstall foundation. After testing this new CLI, if you want to go back to the old CLI, run npm uninstall foundation-cli --global.')
Try npm uninstall foundation-cli --global and then npm install --global foundation-cli
As described here https://github.com/zurb/foundation-cli all you need is Node and Git. Foundation-Cli brings all other things you need. Aside, I was wrong, bower is still in use in F6, but you don't have to deal with it seperately. Sorry.
Maybe you don't have installed the latest foundation-cli version on your system.
I found that they updated foundation-for-sites to 6.2.1. I updated my projects and it is still working.
Just to make sure: what is your standard browser? Mine is Firefox. And maybe you try another more simple directory where you place your project. Maybe not c:\users..., e.g. c:\zf6test</p>
And to get rid of 'Failed to load external module babel-register' do 'npm install gulp-babel babel-preset-es2015 --save-dev'. It's not crucial, but afterwards the error message at the start is gone, too.

Arkarys commented on Will's post over 3 years

Maybe you should uninstall node and install the latest stable version again:https://nodejs.org/dist/v5.10.1/node-v5.10.1-x64.msi
Bower is no longer needed for Founddation 6. It was essential for Foundation 5. 
'npm cache clean' can also help before 'npm install npm -g'
@Alex: Indeed node_modules in a mail project is 160MB and full of nested folders. Try Total Commander, it can deal with extra long file/path names.

Arkarys commented on Will's post over 3 years

I tried it on Win 7 and 10. For me it is working so far.
As I can see on the second screenshot you start the magic with gulp - i get a simple command not found, if I try this.
I start the process with foundation watch (or build)
Do you have node and npm updated?

Arkarys commented on Arkarys's post over 3 years

svg, jpg, png? Eventually all of them.
Just tried the CLI under Ubuntu with all three. No Problem with imagemin here, so it's a 'special' windows problem.
And, as I expected, it's not only a jpg problem but with png, too. (svg is working)Here's the png error:spawn d:\mail\node_modules\gulp-imagemin\node_modules\imagemin\node_modules\imagemin-optipng\node_modules\optipng-bin\vendor\optipng.exe ENOENT
There must be something's going wrong while installation under windows, as there are no exe-files in the given directories.
However, as I said, after uninstall and new installation of the module, it works under windows, too.
 
According to the other issue with babel-register, I habe to admit, I was too quick pressing <strg>+c. In fact, it is running though. Thanks Rafi :)
 

Arkarys commented on Barbara Ahart's post over 3 years

Gulp-babel and babel-preset-es2015 are definitely missing in new site and mail projects."Failed to load external module babel-register"
npm install gulp-babel babel-preset-es2015 --save-devfrom the Upgrading to Foundation 6.2 page does the trick.
Foundation CLI version 2.1.0 under Windows 7, Node 5.5.0, npm 3.3.12, foundation-sites 6.2.0, foundation-emails 2.0.0, foundation-apps-template 1.2.0
And don't use weird characters in directory names. I despaired, until I realized it was an exclamation mark.
 
 

Arkarys commented on Arkarys's post almost 4 years

Hi @Ercan Murat KISACA ,
thanks for this idea. Always good to look up a page with browser's developer tools. ;)
I thought, it could be easier to work with - not that long monster code.
But you're right. User will have to load the same in both cases.
So, I'll keep it inline. It works, that's important.

Aside: Nice example your map with reveal maps and dropdown elements :)

Arkarys commented on Arkarys's post almost 4 years

Meanwhile I installed 'npm install phantom -g', 'npm install python -g' and Python 2.7.11.

Result:
Still 'PhantomJS not found on PATH' and the node-gyp problem as above.

But the former error
'gyp ERR! stack Error: Can't find Python executable "python", ...'
changed to
'VCBuild.exe was not found' and the advice to install Microsoft Windows SDK for Windows Server 2008 and .NET Framework 3.5 or Microsoft Visual Studio 2008

Ehm, I have Microsoft Visual Studio 2012 installed on my machine ?!?

... makes me mad.

Arkarys commented on Arkarys's post almost 4 years

Here you can see what's the problem: www.ark-fx.eu/svg-reveal.html.

Arkarys commented on Ettiene Grobler's post almost 4 years

Better make directories before starting gulp (npm start). I got errors when I added directories while gulp script was running. If you start it afterwards, everything works fine.

Posts Followed



Following

Followers

My Posts




My Comments

You commented on Will's post over 3 years

O-oh. I surrender.
Do you know virtualbox? Maybe you install yourself a linux guest and try it there. I tried that successfully, too.
This was, how I found that I had a leading explamation mark in my directory name which made problems for me.
 

You commented on Will's post over 3 years

Hm, Will, that's weird. Obviously it seems to be a problem with browser-sync
Did you had Foundation 5 installed on your system?
('If you already have the Foundation 5 CLI on your machine, you will only be able to access one of the commands, depending on how your command line environment is configured. If you want to remove the old CLI, run gem uninstall foundation. After testing this new CLI, if you want to go back to the old CLI, run npm uninstall foundation-cli --global.')
Try npm uninstall foundation-cli --global and then npm install --global foundation-cli
As described here https://github.com/zurb/foundation-cli all you need is Node and Git. Foundation-Cli brings all other things you need. Aside, I was wrong, bower is still in use in F6, but you don't have to deal with it seperately. Sorry.
Maybe you don't have installed the latest foundation-cli version on your system.
I found that they updated foundation-for-sites to 6.2.1. I updated my projects and it is still working.
Just to make sure: what is your standard browser? Mine is Firefox. And maybe you try another more simple directory where you place your project. Maybe not c:\users..., e.g. c:\zf6test</p>
And to get rid of 'Failed to load external module babel-register' do 'npm install gulp-babel babel-preset-es2015 --save-dev'. It's not crucial, but afterwards the error message at the start is gone, too.

You commented on Will's post over 3 years

Maybe you should uninstall node and install the latest stable version again:https://nodejs.org/dist/v5.10.1/node-v5.10.1-x64.msi
Bower is no longer needed for Founddation 6. It was essential for Foundation 5. 
'npm cache clean' can also help before 'npm install npm -g'
@Alex: Indeed node_modules in a mail project is 160MB and full of nested folders. Try Total Commander, it can deal with extra long file/path names.

You commented on Will's post over 3 years

I tried it on Win 7 and 10. For me it is working so far.
As I can see on the second screenshot you start the magic with gulp - i get a simple command not found, if I try this.
I start the process with foundation watch (or build)
Do you have node and npm updated?

You commented on Arkarys's post over 3 years

svg, jpg, png? Eventually all of them.
Just tried the CLI under Ubuntu with all three. No Problem with imagemin here, so it's a 'special' windows problem.
And, as I expected, it's not only a jpg problem but with png, too. (svg is working)Here's the png error:spawn d:\mail\node_modules\gulp-imagemin\node_modules\imagemin\node_modules\imagemin-optipng\node_modules\optipng-bin\vendor\optipng.exe ENOENT
There must be something's going wrong while installation under windows, as there are no exe-files in the given directories.
However, as I said, after uninstall and new installation of the module, it works under windows, too.
 
According to the other issue with babel-register, I habe to admit, I was too quick pressing <strg>+c. In fact, it is running though. Thanks Rafi :)
 

You commented on Barbara Ahart's post over 3 years

Gulp-babel and babel-preset-es2015 are definitely missing in new site and mail projects."Failed to load external module babel-register"
npm install gulp-babel babel-preset-es2015 --save-devfrom the Upgrading to Foundation 6.2 page does the trick.
Foundation CLI version 2.1.0 under Windows 7, Node 5.5.0, npm 3.3.12, foundation-sites 6.2.0, foundation-emails 2.0.0, foundation-apps-template 1.2.0
And don't use weird characters in directory names. I despaired, until I realized it was an exclamation mark.
 
 

You commented on Arkarys's post almost 4 years

Hi @Ercan Murat KISACA ,
thanks for this idea. Always good to look up a page with browser's developer tools. ;)
I thought, it could be easier to work with - not that long monster code.
But you're right. User will have to load the same in both cases.
So, I'll keep it inline. It works, that's important.

Aside: Nice example your map with reveal maps and dropdown elements :)

You commented on Arkarys's post almost 4 years

Meanwhile I installed 'npm install phantom -g', 'npm install python -g' and Python 2.7.11.

Result:
Still 'PhantomJS not found on PATH' and the node-gyp problem as above.

But the former error
'gyp ERR! stack Error: Can't find Python executable "python", ...'
changed to
'VCBuild.exe was not found' and the advice to install Microsoft Windows SDK for Windows Server 2008 and .NET Framework 3.5 or Microsoft Visual Studio 2008

Ehm, I have Microsoft Visual Studio 2012 installed on my machine ?!?

... makes me mad.

You commented on Arkarys's post almost 4 years

Here you can see what's the problem: www.ark-fx.eu/svg-reveal.html.

You commented on Ettiene Grobler's post almost 4 years

Better make directories before starting gulp (npm start). I got errors when I added directories while gulp script was running. If you start it afterwards, everything works fine.

Posts Followed

Following

Followers

  • No Content