Skip to content

Commit cc7079e

Browse files
committed
docs: simple update
1 parent 9b63e67 commit cc7079e

File tree

1 file changed

+27
-35
lines changed

1 file changed

+27
-35
lines changed

README.md

Lines changed: 27 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,31 @@
77
[![Standard Code Style][style]][style-url]
88
[![Chat][chat]][chat-badge]
99

10-
This plugin add webp supporting in your html.
10+
This plugin add webp supporting in your html. Also supports [`<amp-img>`](https://amp.dev/documentation/components/amp-img/)
11+
12+
## Install
13+
```bash
14+
$ npm i posthtml posthtml-webp
15+
```
16+
17+
## Usage
18+
19+
``` js
20+
const fs = require('fs');
21+
const posthtml = require('posthtml');
22+
const posthtmlWebp = require('posthtml-webp');
23+
24+
posthtml()
25+
.use(posthtmlWebp(/* Plugin options */))
26+
.process(html/*, options */)
27+
.then(result => fs.writeFileSync('./after.html', result.html));
28+
```
29+
## Example
1130

1231
Before:
1332
``` html
1433
<img src="image.jpg">
34+
<amp-img alt="photo" width="550" height="368" layout="responsive" src="photo.png"></amp-img>
1535
```
1636

1737
After:
@@ -20,47 +40,19 @@ After:
2040
<source type="image/webp" srcset="image.jpg.webp">
2141
<img src="image.jpg">
2242
</picture>
23-
```
24-
25-
Also supports [`<amp-img>`](https://amp.dev/documentation/components/amp-img/)
26-
27-
Before:
28-
```html
29-
<amp-img alt="photo" width="550" height="368" layout="responsive" src="photo.png"></amp-img>
30-
```
31-
32-
After:
33-
```html
3443
<amp-img alt="photo" width="550" height="368" layout="responsive" src="photo.png.webp">
3544
<amp-img alt="photo" width="550" height="368" layout="responsive" src="photo.png" fallback=""></amp-img>
3645
</amp-img>
3746
```
3847

39-
## Install
40-
41-
> npm i posthtml posthtml-webp
48+
## Options
4249

43-
## Plugin options
44-
`replaceExtension` (boolean)
45-
46-
**Default:** false
47-
48-
Replace the extension of the source image with .webp instead of appending .webp to the original filename
49-
50-
**Example**: image.jpg => image.webp (instead of image.jpg.webp)
51-
52-
## Usage
50+
#### `replaceExtension`
5351

54-
``` js
55-
const fs = require('fs');
56-
const posthtml = require('posthtml');
57-
const posthtmlWebp = require('posthtml-webp');
58-
59-
posthtml()
60-
.use(posthtmlWebp(/* Plugin options */))
61-
.process(html/*, options */)
62-
.then(result => fs.writeFileSync('./after.html', result.html));
63-
```
52+
Type: `boolean`
53+
Default: `false`
54+
Description: *Replace the extension of the source image with .webp instead of appending .webp to the original filename*
55+
Example: `image.jpg => image.webp (instead of image.jpg.webp)`
6456

6557
### License [MIT](LICENSE)
6658

0 commit comments

Comments
 (0)