Package Exports

datauri

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (datauri) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

datauri

A simple Data URI scheme module and client for Node.js. To install datauri, just run:

npm install -g datauri (it may require Root privileges)

CLIENT

Print datauri scheme

To print a data-uri scheme from a file

$ datauri brand.png

CSS Background

You can generate or update an output css file with data-uri background:

$ datauri brand.png asset/background.css

If you want to define a Class Name, just type:

$ datauri brand.png asset/background.css MyNewClass

MODULE

Function

var Datauri = require('datauri'),
    dUri    = Datauri('test/myfile.png');

console.log(dUri); //=> "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..."

Class

var Datauri = require('datauri'),
    dUri    = new Datauri('test/myfile.png');

console.log(dUri.content); //=> "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..."
console.log(dUri.mimetype); //=> "image/png"
console.log(dUri.base64); //=> "iVBORw0KGgoAAAANSUhEUgAA..."
console.log(dUri.getCss()); //=> "\n.case {\n    background-image: url('data:image/png;base64,iVBORw..."
console.log(dUri.getCss("myClass")); //=> "\n.myClass {\n    background-image: url('data:image/png;base64,iVBORw..."

Async

var Datauri = require('datauri'),
    dUri    = new Datauri();

dUri.on('encoded', function (content) {
    console.log(content); //=> "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA...";
});

dUri.on('error', function (content) {
    console.log('Fail!');
});

dUri.encode('test/myfile.png');

Chaining all stuff

dUri.on('encoded', function (content) {

        console.log(content); //=> "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..."

        console.log(this.mimetype); //=> "image/png"
        console.log(this.base64); //=> "iVBORw0KGgoAAAANSUhEUgAA..."
        console.log(this.getCss()); //=> "\n.case {\n    background-image: url('data:image/png;base64,iVBORw..."
        console.log(this.getCss("myClass")); //=> "\n.myClass {\n    background-image: url('data:image/png;base64,iVBORw..."
    })
    .on('error', function (content) {
        console.log('Fail!');
    })
    .encode('test/myfile.png');

Function callback

var DataURI = require('datauri');

DataURI('test/myfile.png', function (err, content) {
    if (err) {
        throw err;
    }

    console.log(content); //=> "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..."

    console.log(this.mimetype); //=> "image/png"
    console.log(this.base64); //=> "iVBORw0KGgoAAAANSUhEUgAA..."
    console.log(this.getCss()); //=> "\n.case {\n    background-image: url('data:image/png;base64,iVBORw..."
    console.log(this.getCss("myClass")); //=> "\n.myClass {\n    background-image: url('data:image/png;base64,iVBORw..."
});

Promises /A+ standard (ES6 soon)

var DataURI = require('datauri').promises;

DataURI('test/myfile.png').then(function (content) {
    console.log(content); //=> "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..."
},
function (err) {
    throw err;
});

Create from a string

var Datauri = require('datauri'),
    dUri    = new Datauri();

dUri.format('.png', 'xkcd');

console.log(dUri.content); //=> "data:image/png;base64,eGtjZA=="
console.log(dUri.mimetype); //=> "image/png"
console.log(dUri.base64); //=> "eGtjZA=="
console.log(dUri.getCss("myClassName")); //=> "\n.myClassName {\n    background-image: url('data:image/png;base64,eGtjZA==..."

Create from a Buffer

If you already have your file as a Buffer, use this. It's much faster than passing a string.

var Datauri = require('datauri'),
    dUri    = new Datauri();

//...
var buffer = fs.readFileSync('./hello');
//...

dUri.format('.png', buffer);

console.log(dUri.content); //=> "data:image/png;base64,eGtjZA=="
console.log(dUri.mimetype); //=> "image/png"
console.log(dUri.base64); //=> "eGtjZA=="
console.log(dUri.getCss("myClassName")); //=> "\n.myClassName {\n    background-image: url('data:image/png;base64,eGtjZA==..."

GRUNT

There are a bunch of grunt plugins running on top of datauri module.

grunt-datauri - Create base64 encoded data-uris for css from images
grunt-imweb - IMWEB Tasks Collection For Daily Workflow.
grunt-static-inline - A grunt plugin to replace url from static files such as img,js,css an put inline in a template.
grunt-data-uri - Convert to data-uri from image path.
grunt-inline

GULP

gulp-image-data-uri - A Gulp plugin for converting images to inline data-URIs. Intended to be a simple single-purpose wrapper for heldr/datauri.

DEVELOPING

The only essential library to develop datauri is jshint.

$ make install
$ make test

If you'd like to test the full process including npm installer, just run:

$ make fulltest

Release notes

0.8 - remove node 0.8 support
0.7 - generate css background-image instead of background shorthand
0.6 - io.js support
0.5 - Format data uri from a string
0.4 - Promises support
0.3 - API Rewritten from the top to the bottom + full async compatibility
0.2 - Splitted in submodules mimer and templayed
0.1 - First release

License

MIT License (c) Helder Santana