Miss any of our Open RFC calls?Watch the recordings here! »

postcss-image-inliner

4.0.2 • Public • Published

PostCSS Image Inliner Build Status

PostCSS plugin to inline local/remote images.

.foo {
    /* Input example */
    background-image: url("https://placehold.it/10x10");
}
.foo {
  /* Output example */
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAo ... ORK5CYII=");
}

Usage

const postcss = require('postcss');
const imageInliner = require('postcss-image-inliner');
const opts = {
    assetPaths: [],     // List of directories where the inliner should look for assets
    maxFileSize: 10240  // Sets a max file size (in bytes)
};
 
postcss([ imageInliner(opts) ]);

See PostCSS docs for examples for your environment.

Options

assetPaths

  • Type: array
  • Default: [process.cwd()]
  • Example: ['http://domain.de/', 'http://domain.de/styles', 'app/images', '**/images/']
  • Required: false

List of directories/URLs where the inliner should start looking for assets. You can define local directories (globs supported) or URLs.

maxFileSize

  • Type: int
  • Default: 10240
  • Example: 0
  • Required: false

Sets a max file size (in bytes) for inlined images. Set to 0 to disable size checking.

b64Svg

  • Type: bool
  • Default: false
  • Required: false

Use Base64 encoding for SVGs.

strict

  • Type: bool
  • Default: false
  • Required: false

Fail on error.

Install

npm i postcss-image-inliner

DownloadsWeekly Downloads

18,318

Version

4.0.2

License

MIT

Unpacked Size

9.86 kB

Total Files

6

Last publish

Collaborators

  • avatar