postcss-image-set-polyfill

WebJar for postcss-image-set-polyfill

License	MIT
GroupId	org.webjars.npm
ArtifactId	postcss-image-set-polyfill
Last Version	0.3.5
Release Date	Jun 25, 2018
Type	jar
Description	postcss-image-set-polyfill WebJar for postcss-image-set-polyfill
Project URL	http://webjars.org
Source Code Management	https://github.com/SuperOl3g/postcss-image-set-polyfill

Download postcss-image-set-polyfill

Filename	Size
postcss-image-set-polyfill-0.3.5.pom
postcss-image-set-polyfill-0.3.5.jar	16 KB
postcss-image-set-polyfill-0.3.5-sources.jar	22 bytes
postcss-image-set-polyfill-0.3.5-javadoc.jar	22 bytes

How to add to project

Apache Maven

<!-- https://jarcasting.com/artifacts/org.webjars.npm/postcss-image-set-polyfill/ -->
<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>postcss-image-set-polyfill</artifactId>
    <version>0.3.5</version>
</dependency>

Gradle Groovy

// https://jarcasting.com/artifacts/org.webjars.npm/postcss-image-set-polyfill/
implementation 'org.webjars.npm:postcss-image-set-polyfill:0.3.5'

Gradle Kotlin

// https://jarcasting.com/artifacts/org.webjars.npm/postcss-image-set-polyfill/
implementation ("org.webjars.npm:postcss-image-set-polyfill:0.3.5")

Apache Buildr

'org.webjars.npm:postcss-image-set-polyfill:jar:0.3.5'

Apache Ivy

<dependency org="org.webjars.npm" name="postcss-image-set-polyfill" rev="0.3.5">
  <artifact name="postcss-image-set-polyfill" type="jar" />
</dependency>

Groovy Grape

@Grapes(
@Grab(group='org.webjars.npm', module='postcss-image-set-polyfill', version='0.3.5')
)

Scala SBT

libraryDependencies += "org.webjars.npm" % "postcss-image-set-polyfill" % "0.3.5"

Leiningen

[org.webjars.npm/postcss-image-set-polyfill "0.3.5"]

Dependencies

compile (2)

Group / Artifact	Type	Version
org.webjars.npm : postcss	jar	[6.0.1,7)
org.webjars.npm : postcss-media-query-parser	jar	[0.2.3,0.3)

Project Modules

There are no modules declared in this project.

postcss-image-set-polyfill

PostCSS plugin for polyfilling image-set CSS function for most browsers.

/* Input example */
.foo {
    background-image: image-set(url(img/test.png) 1x,
                                url(img/test-2x.png) 2x,
                                url(my-img-print.png) 600dpi);
}

/* Output example */
.foo {
    background-image: url(img/test.png);
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .foo {
        background-image: url(img/test-2x.png);
    }
}


@media (-webkit-min-device-pixel-ratio: 6.25), (min-resolution: 600dpi) {
    .foo {
        background-image: url(my-img-print.png);
    }
}

→Try it online←

❗️ Resolution media query is supported only by IE9+.

Installation

npm i postcss-image-set-polyfill -D

Usage

var postcssImageSet = require('postcss-image-set-polyfill');

postcss([postcssImageSet]).process(YOUR_CSS, /* options */);

See PostCSS docs for examples for your environment.

⚠️ ️ Warning

If you use autoprefixer, place this plugin before it to prevent styles duplication.

Versions

Version
0.3.5 Jun 25, 2018