JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 242340
  • Score
    100M100P100Q208607F
  • License MIT

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

Module and Client to generate Data URI scheme.

Build Status Coverage Status Dependency Status NPM version

MODULE

npm install --save datauri

const Datauri = require('datauri');
const 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');

Readable Stream

const Datauri = require('datauri');
const datauri = new Datauri();

datauri.pipe(process.stdout);
datauri.encode('test/myfile.png');

Promise (node 0.12+, works with es2016 async/await)

'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;
  });

Callback for vintage users

const DataURI = require('datauri');
const datauri = new DataURI();

datauri.encode('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({
    class: "myClass",
    width: true,
    height: true
  })); //=> adds image width and height and custom class name
});

Create from a string

const DataURI = require('datauri');
const 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

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({
  class: "myClass",
  width: true,
  height: true
})); //=> adds image width and height and custom class name

Chaining all stuff

//...
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');

Sync (kids! Don't use it at home!)

Sync Class

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..."

Sync Function

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..."

NPM SCRIPT AND TERMINAL CLIENT

GULP

GRUNT

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

DEVELOPING

$ 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

Release notes

  • 1.0 - async by default, native promise, streams, split between datauri and datauri-cli package
  • 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