postcss inline

PostCSS inline

Plugin PostCSS yang menempatkan gambar dan font sebagai data URI ke dalam CSS Anda. (Berdasarkan inline gambar PostCSS)

Bergabung menjadi PostCSS-URL

Fitur PostCSS-Inline digabungkan menjadi PostCSS-URL

Tercerahkan

 @font-face {
  font-family : 'MyWebFont' ;
  src : url ( 'webfont.woff' ) format ( 'woff' );
}
. foo {
    background-image : url (one_pixel_transparent.gif);
}
. bar {
    background : 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==);
}
. bar {
    background : url (data:image/gif;base64 , R0lGODlhAQABAIAAAAAAAAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==);
}

Penggunaan

 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 } ) ] )

Lihat dokumen PostCSS untuk contoh untuk lingkungan Anda.