kraken-loader

Image optmization loader for Webpack 2+ using Kraken.io.

1. Installation
2. Options
3. Usage
4. Acknowledgements
5. LICENSE - MIT

Installation

$ npm i -D kraken-loader

Options

The loader supports the following options:

• key - your Kraken API Key
• secret - your Kraken API Secret
• lossy - enable/disable intelligent lossy optimization. Defaults to true
• enabled - enable/disable optimization using this loader. Defaults to true
• silent - enable/disable byte savings message. Defaults to false

The loader also supports supplying your API credentials using the following environment variables:

• KRAKEN_LOADER_KEY - Kraken API Key
• KRAKEN_LOADER_SECRET - Kraken API Secret

The environment variables offer a way to supply your API credentials without having to commit them to your VCS. This is the recommended method for supplying your Kraken.io API credentials.

Usage

It is expected that this plugin will be used alongside the url-loader, file-loader, or raw-loader.

Use with loader defaults

The following example requires your API credentials to be supplied using the supported environment variables (see Options).

module.exports = {
    ...
    module: {
        rules: [
            {
                test: /\.(jpe?g|png|gif|svg)$/i,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            name: 'images/[name].[ext]'
                        }
                    },
                    'kraken-loader'
                ]
            }
        ],
    }
}

Customising the loader config

module.exports = {
    ...
    module: {
        rules: [
            {
                test: /\.(jpe?g|png|gif|svg)$/i,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            name: 'images/[name].[ext]'
                        }
                    },
                    {
                        loader: 'kraken-loader',
                        options: {
                            enabled: process.env.NODE_ENV === 'production',
                            secret: 'my-api-secret',
                            silent: true,
                            lossy: true,
                            key: 'my-api-key'
                        }
                    }
                ]
            }
        ]
    }
}

Supplying your API credentials in the options object is optional. The options object can be used alongside the environment variables for specifying API credentials.

Acknowledgements

This plugin was inspired by the gulp-kraken plugin.

LICENSE - MIT

See LICENSE for details.