JSPM – datauri@1.0.4

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

Node.js Module and Client to generate Data URI scheme.

The data URI scheme is a uniform resource identifier (URI) scheme that provides a way to include data in-line in web pages as if they were external resources.

from: Wikipedia

MODULE

npm install --save datauri

From file path

Asynchronous
Synchronous
- Class
- Function

From a Buffer
From a String
Method chaining
Task plugins using datauri

npm script
gulp
grunt

Readable Stream

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

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

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

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

datauri.on('error', err => console.log(err));
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

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

datauri.encode('test/myfile.png', (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
});

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

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

From a Buffer

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

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

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

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

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

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

Method chaining

//...
datauri
  .on('encoded', 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', err => console.error(err))
  .encode('test/myfile.png');

DEVELOP

$ 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

License

MIT License (c) Helder Santana