gulp-image-inline
A Gulp plugin for converting images to inline data-URIs. Intended to be a simple single-purpose wrapper for heldr/datauri.
Installation
npm install gulp-image-inline
Usage
var gulp = ;var imageDataURI = ; gulp; gulp;
For example output, see test/expected. See Examples for more information.
Options
customClass
An optional function. If omitted, the class added is just the file's basename.
The function is called with two arguments; the default class name and the Vinyl file object. It must return the new class (string). See Examples for more information.
dimension
If flag equal true
, width
and height
will be injected into class;
.icon { width: 32px; height: 32px; background-image: url(...);}
Contributing
See CONTRIBUTING.md
Examples
Example output
For example output, see test/expected.
Combining into one CSS file
Use gulp-concat;
var gulp = ;var imageDataURI = ;var concat = ; gulp; gulp;
Custom classes
var gulp = ;var imageDataURI = ;var path = ; gulp
Including / excluding certain images
Use gulp-filter;
var gulp = ;var imageDataURI = ;var filter = ; gulp; gulp;
Custom CSS
This isn't possible right now because heldr/datauri doesn't support it. If you want this feature, comment on heldr/datauri#6.
Anything missing?
Create an issue / pull-request 😃.