{
"name": "postcss-image-set-function",
"versions": {
"1.0.0": {
"name": "postcss-image-set-function",
"version": "1.0.0",
"description": "Display resolution-dependent images using the image-set() function in CSS",
"author": {
"name": "Jonathan Neal",
"email": "jonathantneal@hotmail.com"
},
"license": "CC0-1.0",
"repository": {
"type": "git",
"url": "git+https://github.com/jonathantneal/postcss-image-set-function.git"
},
"homepage": "https://github.com/jonathantneal/postcss-image-set-function#readme",
"bugs": {
"url": "https://github.com/jonathantneal/postcss-image-set-function/issues"
},
"main": "index.cjs.js",
"module": "index.es.js",
"files": [
"index.cjs.js",
"index.es.js"
],
"scripts": {
"prepublishOnly": "npm test",
"pretest": "rollup -c .rollup.js --silent",
"test": "echo 'Running tests...'; npm run test:js && npm run test:tape",
"test:ec": "echint --ignore index.*.js test",
"test:js": "eslint *.js --cache --ignore-path .gitignore --quiet",
"test:tape": "postcss-tape"
},
"engines": {
"node": ">=4.0.0"
},
"dependencies": {
"postcss": "^6.0.22",
"postcss-values-parser": "^1.5.0"
},
"devDependencies": {
"babel-core": "^6.26.3",
"babel-eslint": "^8.2.3",
"babel-preset-env": "^1.6.1",
"eslint": "^4.19.1",
"eslint-config-dev": "^2.0.0",
"postcss-tape": "^2.2.0",
"pre-commit": "^1.2.2",
"rollup": "^0.58.2",
"rollup-plugin-babel": "^3.0.4"
},
"eslintConfig": {
"extends": "dev",
"parser": "babel-eslint"
},
"keywords": [
"postcss",
"css",
"postcss-plugin",
"image-set",
"background",
"image",
"responsive",
"resolution",
"negotiation",
"optimization"
],
"gitHead": "f9436809c6859b035bc619e4862c6255b89524d0",
"_id": "postcss-image-set-function@1.0.0",
"_npmVersion": "6.0.0",
"_nodeVersion": "10.0.0",
"_npmUser": {
"name": "jonathantneal",
"email": "jonathantneal@hotmail.com"
},
"dist": {
"integrity": "sha512-ta6gz0QT6vSsxxBb9mUNCTml4qNSMNKP/15Goa0wYoXnqrnVxqv+PIbAIGdWAk+HUhYB+F3xytV+zTdcETa6cA==",
"shasum": "27b551274bad490a3ebf47c4f09f25e650d6ceb9",
"tarball": "https://registry.npmjs.org/postcss-image-set-function/-/postcss-image-set-function-1.0.0.tgz",
"fileCount": 6,
"unpackedSize": 22944,
"npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJa8BZhCRA9TVsSAnZWagAAh5QP/0Bv3NP8AsFxRSGwYhf/\nCmNoSdP83L0hyvVQVB9LbFWjqL0ehOJHg0oZAYojUlglpci5mobRuOeqlD9S\nho6swnxDZvt8zrLVV4aUNBpSzBwEVDViZuUWDbpQRRpzcWmmxzKnKWd6fMxi\nlNMkqT24BxxLzkUiXL0f+AW++bW1s/BbgozfNQbS6GlQBbggDY3uxi2To4mK\ny3nLy3E2AvmxpZjqtI0dX4Wwf5wKGHKP6dRHSFVNJiJRi3AelQPT7fAaq8JW\negA1u5VdFVCEiR5QsTiLaMlq3jaJgUAZ+F28+Yd5dtEDBVsBGz6XNKwptzh4\nsRqhyMH4B7EU2mHJ99o83Ijz3bkY5krnItyYl7ViwLIkCKd8XxaLiIQzKaeD\npTGvASnDwo6FDvCCw5ONUN7vD2BkiIxmcCY8b0gwkbJWf68q8UXPt71ERIUL\n4Il9nhek1NifbPgB0/shFYkVi82fhYYRv0gS853247HkIGteTFa0+MHf364j\nkN91U+Bmhk1n11cj/T4Wlx6IH2vF20af+pRAD/JwJfpBA1O3io6NysUT/KE8\nEGJTuqOJd7+6Fi4OvvR9OZg3K+MXs77YHujLksdCk/7VpwEVd/QDPZP+YU9j\nCakfQ+kJROwIhEkjwJM3DtKIlBcCQg2TCfDGbLa5C1YaCAHPiO1QB/0CneSf\nfcv+\r\n=gRhq\r\n-----END PGP SIGNATURE-----\r\n"
},
"maintainers": [
{
"name": "jonathantneal",
"email": "jonathantneal@hotmail.com"
}
],
"directories": {},
"_npmOperationalInternal": {
"host": "s3://npm-registry-packages",
"tmp": "tmp/postcss-image-set-function_1.0.0_1525683807982_0.4923207712348887"
},
"_hasShrinkwrap": false,
"contributors": []
},
"2.0.0": {
"name": "postcss-image-set-function",
"version": "2.0.0",
"description": "Display resolution-dependent images using the image-set() function in CSS",
"author": {
"name": "Jonathan Neal",
"email": "jonathantneal@hotmail.com"
},
"license": "CC0-1.0",
"repository": {
"type": "git",
"url": "git+https://github.com/jonathantneal/postcss-image-set-function.git"
},
"homepage": "https://github.com/jonathantneal/postcss-image-set-function#readme",
"bugs": {
"url": "https://github.com/jonathantneal/postcss-image-set-function/issues"
},
"main": "index.cjs.js",
"module": "index.es.js",
"files": [
"index.cjs.js",
"index.es.js"
],
"scripts": {
"prepublishOnly": "npm test",
"pretest": "rollup -c .rollup.js --silent",
"test": "echo 'Running tests...'; npm run test:js && npm run test:tape",
"test:ec": "echint --ignore index.*.js test",
"test:js": "eslint *.js --cache --ignore-path .gitignore --quiet",
"test:tape": "postcss-tape"
},
"engines": {
"node": ">=4.0.0"
},
"dependencies": {
"postcss": "^6.0.22",
"postcss-values-parser": "^1.5.0"
},
"devDependencies": {
"babel-core": "^6.26.3",
"babel-eslint": "^8.2.3",
"babel-preset-env": "^1.6.1",
"eslint": "^4.19.1",
"eslint-config-dev": "^2.0.0",
"postcss-tape": "^2.2.0",
"pre-commit": "^1.2.2",
"rollup": "^0.58.2",
"rollup-plugin-babel": "^3.0.4"
},
"eslintConfig": {
"extends": "dev",
"parser": "babel-eslint"
},
"keywords": [
"postcss",
"css",
"postcss-plugin",
"image-set",
"background",
"image",
"responsive",
"resolution",
"negotiation",
"optimization"
],
"gitHead": "52fd5c1875e262e76a0a1c92c6b7dd7471e6cff5",
"_id": "postcss-image-set-function@2.0.0",
"_npmVersion": "6.0.0",
"_nodeVersion": "10.0.0",
"_npmUser": {
"name": "jonathantneal",
"email": "jonathantneal@hotmail.com"
},
"dist": {
"integrity": "sha512-2bpCIj2wFhIhpyM1G/ZZgBJM8K/VKbEcQ0SX5MI9MTGv4giPMnuXMa/sX3bHXHhi1PL4v2WRfqD1+w5T9EhFqg==",
"shasum": "3f43f25bc242ec1319c4bd879ccfd62ee5256feb",
"tarball": "https://registry.npmjs.org/postcss-image-set-function/-/postcss-image-set-function-2.0.0.tgz",
"fileCount": 6,
"unpackedSize": 24158,
"npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJa8PKDCRA9TVsSAnZWagAA2sMP/iLmsDPdJAu6w1Eyh1TM\nRrD+3w0XiQcf84kYBd7ibiBc7qj1kTEleehjqPNz+U4aD7KGX0EWHHgggd5x\nqFZW5UXvxuJH7h802bcibc0nrehB/y3PZJrd6k92fNMeEEwljRqlBkMyfGLa\nP4g9aB0qjCeqbfoImvJxuHgpxmfAuh9ANyrFFEHRlnrmlsju7JDe6qNiBHbf\nzAxYa6CM1CJbynJs90aDY9suVQAkTEQp97/bb6FqU93e15cYOh3NbPbZ3Dw1\nC4LxWzE2heV7EZK36jhJ833h493VGHEkWMCwQEW/Xb+fV0OMrCZF/ORtG/ji\n0EUblg6Ewyej42asBPZ/ZyHB2Qtzt7YFMNMOB1vXQswaPq0OV/D6a/CraUEL\nt2EOE3mgkzYlNC64FG9TCNDkhrYjEbHrAclYGd1oacbKfAzwK5B//8HZTpPL\nmN/+1HtCwJeeHpY2WhOvSjD6mXy9nccERON8kvlOPbVMynocxeX9Q8FYoctr\njTJkytaHrtebqHSKPYSRq6OeG0oRxk/ePp5swh6HgakwWylOamnSFlPCvBm2\nTTPHj6LpEAZFm17YSJbz0qflJaa4rTP4DDo2FR01TrpM6KmrkeYcYdcInRhy\nFGrZ3sMR4+/grh9ZT/S26H3OUhuZSjfZiIq2H5HO6zbdyTRVQRbkQ3/qy0zE\nN2Hw\r\n=iHen\r\n-----END PGP SIGNATURE-----\r\n"
},
"maintainers": [
{
"name": "jonathantneal",
"email": "jonathantneal@hotmail.com"
}
],
"directories": {},
"_npmOperationalInternal": {
"host": "s3://npm-registry-packages",
"tmp": "tmp/postcss-image-set-function_2.0.0_1525740162493_0.19278308578660885"
},
"_hasShrinkwrap": false,
"contributors": []
},
"3.0.0": {
"name": "postcss-image-set-function",
"version": "3.0.0",
"description": "Display resolution-dependent images using the image-set() function in CSS",
"author": {
"name": "Jonathan Neal",
"email": "jonathantneal@hotmail.com"
},
"license": "CC0-1.0",
"repository": {
"type": "git",
"url": "git+https://github.com/jonathantneal/postcss-image-set-function.git"
},
"homepage": "https://github.com/jonathantneal/postcss-image-set-function#readme",
"bugs": {
"url": "https://github.com/jonathantneal/postcss-image-set-function/issues"
},
"main": "index.cjs.js",
"module": "index.es.mjs",
"scripts": {
"prepublishOnly": "npm test",
"pretest": "rollup -c .rollup.js --silent",
"test": "echo 'Running tests...'; npm run test:js && npm run test:tape",
"test:ec": "echint --ignore index.*.js test",
"test:js": "eslint *.js --cache --ignore-path .gitignore --quiet",
"test:tape": "postcss-tape"
},
"engines": {
"node": ">=4.0.0"
},
"dependencies": {
"postcss": "^7.0.2",
"postcss-values-parser": "^1.5.0"
},
"devDependencies": {
"@babel/core": "^7.0.0",
"@babel/preset-env": "^7.0.0",
"babel-eslint": "^9.0.0",
"eslint": "^5.6.0",
"eslint-config-dev": "^2.0.0",
"postcss-tape": "^2.2.0",
"pre-commit": "^1.2.2",
"rollup": "^0.66.0",
"rollup-plugin-babel": "^4.0.1"
},
"eslintConfig": {
"extends": "dev",
"parser": "babel-eslint"
},
"keywords": [
"postcss",
"css",
"postcss-plugin",
"image-set",
"background",
"image",
"responsive",
"resolution",
"negotiation",
"optimization"
],
"gitHead": "5ea52ff0c80293055a3a9691799b9c262e22e893",
"_id": "postcss-image-set-function@3.0.0",
"_npmVersion": "6.4.1",
"_nodeVersion": "10.10.0",
"_npmUser": {
"name": "jonathantneal",
"email": "jonathantneal@hotmail.com"
},
"dist": {
"integrity": "sha512-hf/Vm7vHwgz47nmAHv4cD0/HoDnS/hVUiSNGjgwFpZ0UwIcz9AXxTQrdHiQ0T6VKBDGGO3Awt6XDUkSWGfri/A==",
"shasum": "d542c56e284c531d4a8b6cbbae9dfc4d32b24b1a",
"tarball": "https://registry.npmjs.org/postcss-image-set-function/-/postcss-image-set-function-3.0.0.tgz",
"fileCount": 8,
"unpackedSize": 43784,
"npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJboHk4CRA9TVsSAnZWagAAQIoQAJw/tSqIA/ruFpyg7KbL\nCtV8w9J1kRIxWpclSbMa4WXM080d2zyN+/FRsTpPYTlg+K0kUSaF/6jdgK28\n1CNwRca5Xi2pvXnRLgaeXZZh9ymTgacdBftoKeWzveQI8AloUYWjRP61dGOD\nydchjcDP98qXq2Ei7zOLLqkis/m49vabfRWqKpIM93cQo4CGID48Ca1e1iyq\nikSj64ICUS44bkgi6K9wfMjx5kEwGbwfFG0N1peBDIApaRyVUBpqJzSeza7y\n8eBH9TUtSpA07H5yyEADuoOl/mStIp0FiqygjdLOLN+WtgsZQGdfE6ESldgf\nXBzW0AQFLAB81/v9KvYevkZQsrgjO4UkFUFdtYVbK68foe4NeNaDh8HCtzvi\nky1ukK/d88jdUpFxJT0r4s1U0BFIWMJCb7fgeOmZw6k+hBYqyNg8ZuTHHQDe\nrxVsETeivVWBgmJ5DHu03GKCAZcECsJw3XD1ooXgJlniJnw0a8EHvX/uJaTc\nHXLnhVp/ygRrZwKB69QbdYlmOJ/WGtruMlBlpMgAHZE1B/QQMBYAynS5agcL\n9Gpx58gcMinLkR30sFRZ94P5JpaXm3lR0Jch1qF74PMQVkQjIp5i0c4SKKJP\nX2e8s2x8Gw/1mRhIidKHQu+Z9anMO+4SWuGlDUb35ecZJQwsiDHlJOuL3Lk6\n+wx4\r\n=6Q2M\r\n-----END PGP SIGNATURE-----\r\n"
},
"maintainers": [
{
"name": "jonathantneal",
"email": "jonathantneal@hotmail.com"
}
],
"directories": {},
"_npmOperationalInternal": {
"host": "s3://npm-registry-packages",
"tmp": "tmp/postcss-image-set-function_3.0.0_1537243448007_0.007483898310437498"
},
"_hasShrinkwrap": false,
"contributors": []
},
"3.0.1": {
"name": "postcss-image-set-function",
"version": "3.0.1",
"description": "Display resolution-dependent images using the image-set() function in CSS",
"author": {
"name": "Jonathan Neal",
"email": "jonathantneal@hotmail.com"
},
"license": "CC0-1.0",
"repository": {
"type": "git",
"url": "git+https://github.com/jonathantneal/postcss-image-set-function.git"
},
"homepage": "https://github.com/jonathantneal/postcss-image-set-function#readme",
"bugs": {
"url": "https://github.com/jonathantneal/postcss-image-set-function/issues"
},
"main": "index.cjs.js",
"module": "index.es.mjs",
"scripts": {
"prepublishOnly": "npm test",
"pretest": "rollup -c .rollup.js --silent",
"test": "echo 'Running tests...'; npm run test:js && npm run test:tape",
"test:ec": "echint --ignore index.*.js test",
"test:js": "eslint *.js --cache --ignore-path .gitignore --quiet",
"test:tape": "postcss-tape"
},
"engines": {
"node": ">=6.0.0"
},
"dependencies": {
"postcss": "^7.0.2",
"postcss-values-parser": "^2.0.0"
},
"devDependencies": {
"@babel/core": "^7.1.0",
"@babel/preset-env": "^7.1.0",
"babel-eslint": "^9.0.0",
"eslint": "^5.6.0",
"eslint-config-dev": "^2.0.0",
"postcss-tape": "^2.2.0",
"pre-commit": "^1.2.2",
"rollup": "^0.66.0",
"rollup-plugin-babel": "^4.0.3"
},
"eslintConfig": {
"extends": "dev",
"parser": "babel-eslint"
},
"keywords": [
"postcss",
"css",
"postcss-plugin",
"image-set",
"background",
"image",
"responsive",
"resolution",
"negotiation",
"optimization"
],
"gitHead": "2bdb8c42d011a4fe0becd4fc060a25ae4a1195fb",
"_id": "postcss-image-set-function@3.0.1",
"_npmVersion": "6.4.1",
"_nodeVersion": "10.10.0",
"_npmUser": {
"name": "jonathantneal",
"email": "jonathantneal@hotmail.com"
},
"dist": {
"integrity": "sha512-oPTcFFip5LZy8Y/whto91L9xdRHCWEMs3e1MdJxhgt4jy2WYXfhkng59fH5qLXSCPN8k4n94p1Czrfe5IOkKUw==",
"shasum": "28920a2f29945bed4c3198d7df6496d410d3f288",
"tarball": "https://registry.npmjs.org/postcss-image-set-function/-/postcss-image-set-function-3.0.1.tgz",
"fileCount": 8,
"unpackedSize": 43960,
"npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJboSDxCRA9TVsSAnZWagAAMzAP/Rakl7jeTmRM+MeTnJ3b\nqF5yHOix8WSITZRXZs+Sz3fHb2fYz2NqrCWDH+1SxDrdFjGQARHaBXDqx/fF\n4jhsJUBdht9GWnsjgd7uikynQUFXzKoWYBIabDxmDgSISS+I8jv/Dad+MZdG\ne2lI2gLhqIT9MRIiuy2NiqS61X+JPDT70ezdpRYcyqgQOHswa568cL3nq40e\nW5Ba4xjxSOnZkw1WXbaq8oIE2H8s21dnJVjB4knGn911GDinwfjz0V3J/KrI\nyuq+a2fjygDxFUdDi7GlOH2h/sE4n6rygXsScJ9VffsV5EIUY987Pf09G8LH\nOHJ1kZv+5rLFit3HD/wvyIQKb5kR9L2KXwKzF97DjsX45Ob+dwc44iJfoAsS\np0RHDBMCqlvQ5Qb8qurjCdtLerB+MB/PDO8968xf/7edpYI4jN/HMjfqOWgm\nQluPrZDVBgolNMazz9/9W8mVOo7yrWMvlA68YpJd8neCDXa0GtEKmz/Ogwz7\nprXopteEviDDSPNyN5znNoxfEeDXi5Q5bvKf7k9K6Re8FzHCvjxqirXsyjDX\n0T9v/5uyETvsfquIrVfZpHkb59jANWym45BFP39UBcXmZxqzjX8fuUpdp61g\nBzT0Am5bD9ApWYvmOwJWPEQ8xPWltyksXggxfZXz2GbT+lD2G4PeEO9S5SnJ\nYaI5\r\n=73Hu\r\n-----END PGP SIGNATURE-----\r\n"
},
"maintainers": [
{
"name": "jonathantneal",
"email": "jonathantneal@hotmail.com"
}
],
"directories": {},
"_npmOperationalInternal": {
"host": "s3://npm-registry-packages",
"tmp": "tmp/postcss-image-set-function_3.0.1_1537286384324_0.8593911552716658"
},
"_hasShrinkwrap": false,
"contributors": []
}
},
"time": {
"created": "2018-05-07T09:03:27.982Z",
"1.0.0": "2018-05-07T09:03:28.070Z",
"modified": "2018-09-18T15:59:48.078Z",
"2.0.0": "2018-05-08T00:42:42.549Z",
"3.0.0": "2018-09-18T04:04:08.129Z",
"3.0.1": "2018-09-18T15:59:44.449Z"
},
"users": {},
"dist-tags": {
"latest": "3.0.1"
},
"_uplinks": {
"npmjs": {
"etag": "W/\"6ea203833c19591a2be3ad8ef95f58e1\"",
"fetched": 1600679295926
}
},
"_distfiles": {
"postcss-image-set-function-1.0.0.tgz": {
"url": "https://registry.npmjs.org/postcss-image-set-function/-/postcss-image-set-function-1.0.0.tgz",
"sha": "27b551274bad490a3ebf47c4f09f25e650d6ceb9",
"registry": "npmjs"
},
"postcss-image-set-function-2.0.0.tgz": {
"url": "https://registry.npmjs.org/postcss-image-set-function/-/postcss-image-set-function-2.0.0.tgz",
"sha": "3f43f25bc242ec1319c4bd879ccfd62ee5256feb",
"registry": "npmjs"
},
"postcss-image-set-function-3.0.0.tgz": {
"url": "https://registry.npmjs.org/postcss-image-set-function/-/postcss-image-set-function-3.0.0.tgz",
"sha": "d542c56e284c531d4a8b6cbbae9dfc4d32b24b1a",
"registry": "npmjs"
},
"postcss-image-set-function-3.0.1.tgz": {
"url": "https://registry.npmjs.org/postcss-image-set-function/-/postcss-image-set-function-3.0.1.tgz",
"sha": "28920a2f29945bed4c3198d7df6496d410d3f288",
"registry": "npmjs"
}
},
"_attachments": {
"postcss-image-set-function-3.0.1.tgz": {
"shasum": "28920a2f29945bed4c3198d7df6496d410d3f288"
}
},
"_rev": "2-924995f9750e5427",
"_id": "postcss-image-set-function",
"readme": "# PostCSS image-set() Function [![\"PostCSS](\"https://postcss.github.io/postcss/logo.svg\")
][postcss]\n\n[![NPM Version][npm-img]][npm-url]\n[![CSS Standard Status][css-img]][css-url]\n[![Build Status][cli-img]][cli-url]\n[![Support Chat][git-img]][git-url]\n\n[PostCSS image-set() Function] lets you display resolution-dependent images\nusing the `image-set()` function in CSS, following the [CSS Images]\nspecification.\n\n```pcss\n.example {\n background-image: image-set(\n url(img.png) 1x,\n url(img@2x.png) 2x,\n url(img@print.png) 600dpi\n );\n}\n\n/* becomes */\n\n.example {\n background-image: url(img.png);\n}\n\n@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {\n .example {\n background-image: url(img@2x.png);\n }\n}\n\n\n@media (-webkit-min-device-pixel-ratio: 6.25), (min-resolution: 600dpi) {\n .example {\n background-image: url(my@print.png);\n }\n}\n\n.example {\n background-image: image-set(\n url(img.png) 1x,\n url(img@2x.png) 2x,\n url(img@print.png) 600dpi\n );\n}\n```\n\n## Usage\n\nAdd [PostCSS image-set() Function] to your project:\n\n```bash\nnpm install postcss-image-set-function --save-dev\n```\n\nUse [PostCSS image-set() Function] to process your CSS:\n\n```js\nconst postcssImageSetFunction = require('postcss-image-set-function');\n\npostcssImageSetFunction.process(YOUR_CSS /*, processOptions, pluginOptions */);\n```\n\nOr use it as a [PostCSS] plugin:\n\n```js\nconst postcss = require('postcss');\nconst postcssImageSetFunction = require('postcss-image-set-function');\n\npostcss([\n postcssImageSetFunction(/* pluginOptions */)\n]).process(YOUR_CSS /*, processOptions */);\n```\n\n[PostCSS image-set() Function] runs in all Node environments, with special\ninstructions for:\n\n| [Node](INSTALL.md#node) | [PostCSS CLI](INSTALL.md#postcss-cli) | [Webpack](INSTALL.md#webpack) | [Create React App](INSTALL.md#create-react-app) | [Gulp](INSTALL.md#gulp) | [Grunt](INSTALL.md#grunt) |\n| --- | --- | --- | --- | --- | --- |\n\n## Options\n\n### preserve\n\nThe `preserve` option determines whether the original declaration using\n`image-set()` is preserved. By default, it is preserved.\n\n```js\npostcssImageSetFunction({ preserve: false })\n```\n\n```pcss\n.example {\n background-image: image-set(\n url(img.png) 1x,\n url(img@2x.png) 2x,\n url(img@print.png) 600dpi\n );\n}\n\n/* becomes */\n\n.example {\n background-image: url(img.png);\n}\n\n@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {\n .example {\n background-image: url(img@2x.png);\n }\n}\n\n\n@media (-webkit-min-device-pixel-ratio: 6.25), (min-resolution: 600dpi) {\n .example {\n background-image: url(my@print.png);\n }\n}\n```\n\n### onvalid\n\nThe `oninvalid` option determines how invalid usage of `image-set()` should be\nhandled. By default, invalid usages of `image-set()` are ignored. They can be\nconfigured to display a `warning` or `throw` an error.\n\n```js\npostcssImageSetFunction({ oninvalid: 'warning' }) // warn on invalid usages\n```\n\n```js\npostcssImageSetFunction({ oninvalid: 'throw' }) // throw on invalid usages\n```\n\n## Image Resolution\n\nThe `image-set()` function allows an author to provide multiple resolutions of\nan image and let the browser decide which is most appropriate in a given\nsituation. The `image-set()` also never fails to choose an image; the\n`` just helps determine which of the images is chosen.\n\nSince this plugin is not a browser, the image options are sorted by device\npixel ratio and the lowest ratio is used as the default, while the remaining\nimages are pushed behind media queries.\n\nTherefore, this plugin can only approximate native browser behavior. While\nimages should typically match the resolution as the device they’re being viewed\nin, other factors can affect the chosen image. For example, if the user is on a\nslow mobile connection, the browser may prefer to select a lower-res image\nrather than wait for a larger, resolution-matching image to load.\n\n[cli-img]: https://img.shields.io/travis/jonathantneal/postcss-image-set-function.svg\n[cli-url]: https://travis-ci.org/jonathantneal/postcss-image-set-function\n[css-img]: https://cssdb.org/badge/image-set-function.svg\n[css-url]: https://cssdb.org/#image-set-function\n[git-img]: https://img.shields.io/badge/support-chat-blue.svg\n[git-url]: https://gitter.im/postcss/postcss\n[npm-img]: https://img.shields.io/npm/v/postcss-image-set-function.svg\n[npm-url]: https://www.npmjs.com/package/postcss-image-set-function\n\n[CSS Images]: https://drafts.csswg.org/css-images-4/#image-set-notation\n[Gulp PostCSS]: https://github.com/postcss/gulp-postcss\n[Grunt PostCSS]: https://github.com/nDmitry/grunt-postcss\n[PostCSS]: https://github.com/postcss/postcss\n[PostCSS Loader]: https://github.com/postcss/postcss-loader\n[PostCSS image-set() Function]: https://github.com/jonathantneal/postcss-image-set-function"
}