grunt-multiresize

    0.3.2 • Public • Published

    grunt-multiresize

    Export multiple sizes from an image

    Getting Started

    This plugin requires GraphicsMagick and Grunt ~0.4.1

    First download and install GraphicsMagick. In Mac OS X, you can simply use Homebrew and do:

    brew install graphicsmagick
    

    If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:

    npm install grunt-multiresize --save-dev

    Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:

    grunt.loadNpmTasks('grunt-multiresize');

    The "multiresize" task

    Overview

    In your project's Gruntfile, add a section named multiresize to the data object passed into grunt.initConfig().

    grunt.initConfig({
      multiresize: {
        target: {
          src: 'path/to/source',
          dest: ['path/to/dest1', '/path/to/dest2'],
          destSizes: ['72x72', '114x114']
        }
      },
    })

    Task

    src

    Type: String

    The original file to be resized.

    dest

    Type: String or Array

    The files to be written by this script.

    destSizes

    Type: Array

    The image dimensions expected. The format can be witdhxheight or n%.

    Options

    options.background

    Type: String

    Background color, default transparent. The format described here.

    options.quality

    Type: String

    Quality of output image, default 100.

    Usage Examples

    Outputting all icons

    This project was originally created to resize our project icons to conform to CoronaSDK spec. This is our config file.

    grunt.initConfig({
      multiresize: {
        iOS: {
          src: 'orig/Icon-512.png',
          dest: ['Icon.png', 'Icon@2x.png', 'Icon-72.png', 'Icon-72@2x.png'],
          destSizes: ['57x57', '114x114', '72x72', '144x144']
        },
        Android: {
          options: {
            background: '#ffffff'
          },
          src: 'orig/Icon-Android-512.png',
          dest: ['Icon-ldpi.png', 'Icon-mdpi.png', 'Icon-hdpi.png', 'Icon-xhdpi.png'],
          destSizes: ['36x36', '48x48', '72x72', '96x96']
        }
      },
    })

    Contributing

    In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code using Grunt.

    Release History

    v0.1.0: Initial release

    Keywords

    Install

    npm i grunt-multiresize

    DownloadsWeekly Downloads

    14

    Version

    0.3.2

    License

    none

    Last publish

    Collaborators

    • jeduan