Buckets:
srcset
Parse and stringify the HTML
<img>srcset attribute.
Can be useful if you're creating a build-tool.
Install
$ npm install srcset
Usage
How an image with srcset might look like:
<img
alt="The Breakfast Combo"
src="banner.jpg"
srcset="banner-HD.jpg 2x, banner-phone.jpg 100w"
>
Then have some fun with it:
const srcset = require('srcset');
const parsed = srcset.parse('banner-HD.jpg 2x, banner-phone.jpg 100w');
console.log(parsed);
/*
[
{
url: 'banner-HD.jpg',
density: 2
},
{
url: 'banner-phone.jpg',
width: 100
}
]
*/
parsed.push({
url: 'banner-super-HD.jpg',
density: 3
});
const stringified = srcset.stringify(parsed);
console.log(stringified);
/*
banner-HD.jpg 2x, banner-phone.jpg 100w, banner-super-HD.jpg 3x
*/
API
.parse(string, options?)
Parse the HTML <img> srcset attribute.
Accepts a “srcset” string and returns an array of objects with the possible properties: url (always), width, height, and density.
string
Type: string
A “srcset” string.
options
Type: object
strict
Type: boolean
Default: false
When enabled, an invalid “srcset” string will cause an error to be thrown. When disabled, a best effort will be made to parse the string, potentially resulting in invalid or nonsensical output.
.stringify(SrcSetDefinitions, options?)
Stringify SrcSetDefinitions. Accepts an array of SrcSetDefinition objects and returns a “srcset” string.
srcsetDescriptors
Type: array
An array of SrcSetDefinition objects. Each object should have a url field and may have width, height or density fields. When the strict option is true, only width or density is accepted.
options
Type: object
strict
Type: boolean
Default: false
Enable or disable validation of the SrcSetDefinitions. When true, invalid input will cause an error to be thrown. When false, a best effort will be made to stringify invalid input, likely resulting in invalid srcset value.
Tidelift helps make open source sustainable for maintainers while giving companies
assurances about security, maintenance, and licensing for their dependencies.
Xet Storage Details
- Size:
- 2.68 kB
- Xet hash:
- 76923478fa346097c301684f5527a32e29e655f24343ed4e039c3d3435169ca3
Xet efficiently stores files, intelligently splitting them into unique chunks and accelerating uploads and downloads. More info.