1.2.0 • Published 10 years ago

postcss-inline v1.2.0

Weekly downloads
41
License
MIT
Repository
github
Last release
10 years ago

PostCSS Inline Build Status

PostCSS plugin that puts images and fonts as data URIs into your CSS. (based on PostCSS Image Inline)

@font-face {
  font-family: 'MyWebFont';
  src: url('webfont.woff') format('woff');
}
.foo {
    background-inline: url(one_pixel_transparent.gif);
}
@font-face {
  font-family: 'MyWebFont';
  src: url('data:application/x-font-woff;base64,AACH5BAEAAAAALA...==') format('woff');
}
.foo {
    background-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==);
}

Usage

postcss([ require('postcss-inline') ])
// Inline only woff files:
postcss([ require('postcss-inline'){filter: /.woff$/} ])
// Specify the base path for the assets
postcss([ require('postcss-inline'){basePath: '/some/path'} ])
// Delete assets after inline (use with care!)
postcss([ require('postcss-inline'){deleteAsset: true} ])

See PostCSS docs for examples for your environment.