excellenteasy / grunt-image-resize Goto Github PK

This function 71 line: gm(filepath).size(function(err, size) { } returns size that equals undefined.
I've installed ImageMagick and all needed libs. (convert -help are working)

Grunt config:

image_resize: {
            '16px':{
                options: {
                    width: 16,
                    height: 16,
                    overwrite: true
                },
                files: [{
                    expand: true,
                    src: ['input/*.png'],
                    dest: 'out/'
                }]
            }
    }

And in fact some files are processed(until task find an error)

OS: Windows7

Upd: It's definitely not a wrong path issue.

MAC AIR OS 10.8.4

Fatal error: Cannot read property 'width' of undefined

Hi,
is it possible to convert jpeg from cmyk to rgb with this task or do you have any hints for me?

Many greets!

Details in this Stackoverflow post

Hey there! Great bit of work you've got here!

I'm currently using your plugin to downscale some PNGs for retina / non-retina support. Our artist took a great deal of care and time ensuring there was no aliasing of our PNGs for optimal compression, however, when downscaling, we run into a minor issue where Aliasing is applied.

Original:

Downscaled:

As there is no Filter Option as part of the grunt-image-resize task, there is no easy way to pass this into GraphicsMagick, however, it seems to be a fairly trivial task to add it.

On line 89 of image_resize.js:

var resizer = gm(filepath)
 .resize(imOptions.width, imOptions.height);

If I hack in:

var resizer = gm(filepath)
 .filter('Point')
 .resize(imOptions.width, imOptions.height);

I receive a Downscaled image with my specific use case solved for! Hooray!

Obviously, this is not the final solution for the code, I would propose we allow a new Option to be passed via Grunt, which is "filter" (Or "interpolation", I don't really care what we name it). Filter would default to what GraphicsMagick defaults to if not passed via Grunt.

Available options would include:
Point | Box | Triangle | Hermite | Hanning | Hamming | Blackman | Gaussian | Quadratic | Cubic | Catrom | Mitchell | Lanczos | Bessel | Sinc

From GraphicsMagick documentation, here: http://www.graphicsmagick.org/GraphicsMagick.html#details-filter

As most people want clean, smooth, aliased resizes which Grunt Image Resizes supports, this is definitely a unique use case, but it would be great to see it added!

I only have experience with the gulp version of this plugin, but I have the following scenario.

I currently have the image quality in the plugin set at 85. This perfectly optimises images above this. However, if an image is less than this (60 for example), it upscales it back to 85 - even when upscaling is set to false.

For example, ignore aspect ratio.

When running the image_resize task i got the following error:

Fatal error: Cannot call method 'match' of undefined

My task configuration is:

        image_resize: {
            options: {
                width: 100,
                overwrite: true
            },
            resize: {
                files: [
                    {
                        flatten: true,
                        expand: true,
                        cwd: '<%= paths.images %>/products/src',
                        src: ['*.jpg'],
                        dest: '<%= paths.images %>/products/resized/',
                        ext: '.jpg'
                    }
                ]
            }
        }

My current system is:

OS: Ubuntu 12.04
Grunt: 0.4.1

Hi there

Firstly, thanks for putting grunt images resize out in the open - it's fantastic and I'm using it on a client project very successfully.

I'd like to suggest a feature request if I may: a particular project of mine requires that all images be not only resized but watermarked with a transparent png image. Is there any way that this functionality could be incorporated into this?

Cheers

Jim

Hi, is it possible to use a "scale" value to resize the images instead of "pixels".

I see in the example it has:

$ convert rose.jpg -resize 50% rose.png

I have an 'HD' folder of various different sized images and I would like to duplicate it and resize all the images to a scale e.g. 50% to create s SD version of the assets.

If available, it could be a flag in the options e.g: "scaleImages : true"

Thanks

Hi!

We are try to install your pakage on Linux CENTOS server but we do not know how configure the 'PATH'.
We try with 'YUM' yum install imagemagick and yum install graphicsmagick but not works.

Please, can you help us?

Regards!!

Hi,

The plugin allowed specifying only width -or height- to maintain the aspect ratio of the image. Now, that causes the generated image size to be 1x1.

Since the commit aheckmann/gm@781fb82 changes the gm resize implementation, a 0-value is considered as a valid width/height. The grunt-image-resize should not provide '0' as default value anymore. Instead '' (empty string) should do the job.

I'm not sure if this is the intended behaviour but I need to resize about 2GB of images in hundreds of nested directories & copying the images from the source directory to the destination directory removes the file structure.

So far, single and multiple images are possible to resize to one given size at the same time. Is there any way we can resize single(and even multiple) images to resize to multiple given size at the same time?

It would be fantastic if you could generate lots of different size images, with a configurable naming convention for the output.

gm has been updated as version 1.18.1. And image-resize throws errors with gm 1.18.1. It's okay with 1.17.0, so there might be an issue with their recent updates.

Running "image_resize:dist" (image_resize) task
Warning: Command failed: convert: negative or zero image size `client/static/img/sp_2x.png' @ error/resize.c/ResizeImage/2968.
 Use --force to continue.

For me, grunt-contrib-copy corrupts images. In finding a workaround, I modified this task to have a 'copy' option that saves the image without resizing, as well as allowing renaming. In total, it involved adding 2 lines and changing 2 others.

Do you think these changes belong in this task, or should there be a separate image-copy task until copy and concat work out their image problems?

It would be good to have an option to specify an aspect ratio instead of an explicit width and height, and have those be determined by the individual file's dimension.

For instance, If I have a folder with the following image files and dimensions, and I want all of them to end up being resized to a 16:9 format:
a.jpg - 1200px * 800px
b.png - 1920px * 1200px
c.jpg - 200px * 200px
d.jpg - 800px * 400px

I could have them all set to a certain width and height, but that may mean some of them will be inflated, which isn't desirable.

A better option would be add an aspect-ratio option, say 16:9 in this case, and have resizing be based on the image dimensions and specified ratio. With the above files as example, we would end up with the following files in the dist folder:
a.jpg - 1200px*675px
b.png - 1920px * 1080px
c.jpg - 200px * 112px
d.jpg - 711px * 400px

I want to resize images only if a particular image isn't converted before or is not present in the destination folder. How can I do this?

I am using gulp-image-resize which is a fork of this project and my gulpfile is like:

var gulp = require('gulp');
var imageResize = require('gulp-image-resize');

gulp.task('default', function () {
    gulp.src('images/fulls/*')
        .pipe(imageResize({
            width: 1024,
            imageMagick: true
        }))
        .pipe(gulp.dest('images/fulls'));
    gulp.src('images/fulls/*')
        .pipe(imageResize({
            width: 512,
            imageMagick: true
        }))
        .pipe(gulp.dest('images/thumbs'));
});

I want to resize all images inside this folder recursively (and keep folder structure).

Here is my config:

image_resize: {
      resize: {
        options: {
          width: 400,
        },
        expand: true,
        src: '<%= yeoman.app %>/images/menu/**/*',
        dest: '<%= yeoman.dist %>/thumbnails/'
      }
    }

When I run it:

$ grunt image_resize
Running "image_resize:resize" (image_resize) task
Fatal error: Cannot read property 'width' of undefined


Execution Time (2015-03-29 00:24:10 UTC)
loading tasks         2ms  ▇▇▇ 3%
image_resize:resize  77ms  ▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ 97%
Total 79ms

Code is available on umpirsky/stajesti.rs@24f3b76.

I am aware of #14 and #11, but looks like it is not my case.

I noticed that it resizes successfully only for first folder, and then fails with this error.

It would be cool to have an option to resize images at different sizes based on whether they are portrait or landscape oriented images. I didn't seem an option for this so I assume it isn't currently possible.

Not sure what else to add - the title says it all. Here is a bit more output:

Running "image_resize:resize" (image_resize) task
Warning: Command failed: Invalid Parameter - 100
Use --force to continue.

By default the image is cropped in the center, but on some occasion it needs top be cropped differently. For instance a page screenshot is sometimes more usefull if we only keep the top of the page and cut the bottom.

ImageMagick has an option 'gravity' which seems to do exactly that.

This will enable sub folder support via cwd option:

cwd: 'assets/src/',
src: '*/*.png',
dest: 'assets/images/',

the files will be resized from > to:

assets/src/folder/image.png > assets/images/folder/image.png
assets/src/another/file.jpg > assets/images/another/file.jpg

-51 filepath = f, imOptions = {
+51 filepath = (list.cwd || '')+f, imOptions = {

-53 dstPath:  (list.dest[list.dest.length-1] !== '/') ? list.dest : path.join(dirname, path.basename(filepath)) ,
-53 dstPath:  (list.dest[list.dest.length-1] !== '/') ? list.dest : path.join(dirname, path.dirname(f), path.basename(filepath)) ,

-104 grunt.log.ok('Image '+filepath+' resized to '+ list.dest);
+104 grunt.log.ok('Image '+filepath+' resized to '+ imOptions.dstPath);

Thanks