datauri

<a href="http://npm.im/datauri">Module</a> and <a href="http://npm.im/datauri-cli">Client</a> to generate [Data URI scheme][datauri].

datauri

Module and Client to generate Data URI scheme.

npm install --save datauri

const Datauri = require('datauri');
let   datauri = new Datauri();
 
datauri.on('encoded', function (content) {
    console.log(content); //=> "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..."; 
});
 
datauri.on('error', function (content) {
    console.log('Fail!');
});
 
datauri.encode('test/myfile.png');
'use strict';
 
const DataURI = require('datauri').promise;
// babelers: import { promise as DataURI } from 'datauri'; 
 
DataURI('test/myfile.png')
  .then((content) => {
    console.log(content); //=> "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..." 
  }).catch((err) => {
    throw err;
  });
const DataURI = require('datauri');
let   datauri = new DataURI();
 
datauri.encode('test/myfile.png', function (errcontent) {
  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({
    class: "myClass",
    width: true,
    height: true
  })); //=> adds image width and height and custom class name 
});
 
const DataURI = require('datauri');
let datauri   = new Datauri();
 
datauri.format('.png', 'xkcd');
 
console.log(datauri.content); //=> "data:image/png;base64,eGtjZA==" 
console.log(datauri.mimetype); //=> "image/png" 
console.log(datauri.base64); //=> "eGtjZA==" 
console.log(datauri.getCSS({
  class: "myClass",
  width: true,
  height: true
})); //=> adds image width and height and custom class name 
 

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({
  class: "myClass",
  width: true,
  height: true
})); //=> adds image width and height and custom class name 
 
//... 
datauri
  .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({
      class: "myClass"
    }); //=> "\n.myClass {\n    background-image: url('data:image/png;base64,iVBORw..." 
  })
  .on('error', function (content) {
      console.log('Fail!');
  })
  .encode('test/myfile.png');

If DataURI class is instanciated with a file path, the same will be processed synchronously.

const Datauri = require('datauri');
let   datauri = new Datauri('test/myfile.png');
 
console.log(datauri.content); //=> "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..." 
console.log(datauri.mimetype); //=> "image/png" 
console.log(datauri.base64); //=> "iVBORw0KGgoAAAANSUhEUgAA..." 
console.log(datauri.getCSS()); //=> "\n.case {\n    background-image: url('data:image/png;base64,iVBORw..." 
console.log(datauri.getCSS("myClass")); //=> "\n.myClass {\n    background-image: url('data:image/png;base64,iVBORw..." 
const Datauri = require('datauri').sync;
 
console.log(Datauri('test/myfile.png')); //=> "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..." 

or for ES2015/6 lovers

import { sync as DataURI } from 'datauri';
 
console.log(DataURI('test/myfile.png')); //=> "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..." 

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

$ npm install
$ npm run check

To run test specs

$ npm run spec

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

$ npm run fulltest
  • 1.0-alpha - many changes, will be well documented soon
  • 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

MIT License (c) Helder Santana