docs: change README

tolking · Jul 8, 2020 · 67f8a0b · 67f8a0b
1 parent 21e7b76
commit 67f8a0b
Show file tree

Hide file tree

Showing 4 changed files with 62 additions and 14 deletions.
diff --git a/README.md b/README.md
@@ -2,9 +2,9 @@
 
 > a vuepress plugin to better supporting image lazy loading
 
-**The plugin will preferentially use native image [lazy-loading](https://caniuse.com/#feat=loading-lazy-attr), if the browser does not support it, it will be implemented through lozad**
+**The plugin will preferentially use native image [lazy-loading](https://caniuse.com/#feat=loading-lazy-attr), if the browser does not support it, it will be implemented through [IntersectionObserver](https://caniuse.com/#feat=intersectionobserver)**
 
-base on [markdown-it-img-lazy](https://github.com/tolking/markdown-it-img-lazy) and [markdown-it-imsize](https://github.com/tatsy/markdown-it-imsize) and [lozad](https://github.com/ApoorvSaxena/lozad.js)
+base on [markdown-it-img-lazy](https://github.com/tolking/markdown-it-img-lazy) and [markdown-it-imsize](https://github.com/tatsy/markdown-it-imsize)
 
 [Live Demo and Documentation](https://tolking.github.io/vuepress-plugin-img-lazy/preview.html)
 
@@ -73,18 +73,34 @@ export default {
 
 ## Options
 
-### useLoading
+### useNative
 - Type: `Boolben`
 - Default: `true`
+- Required: `false`
 
 Use the native image lazy-loading for the web
 
 ### selector
 - Type: `string`
 - Default: `lazy`
+- Required: `false`
 
 Default class name for image
 
+### rootMargin
+- Type: `String`
+- Default: `200px`
+- Required: `false`
+
+rootMargin for IntersectionObserver
+
+### prefix
+- Type: `string` `Function`
+- Default: `src => src && src.charAt(0) === '/' && !src.startsWith(ctx.base) ? ctx.base + src.slice(1) : src`
+- Required: `false`
+
+Config prefix for src in images
+
 ## Other
 
 1. [Base URL](https://vuepress.vuejs.org/guide/assets.html#rBase%20URL) already included by default, But it does not include the `<img/>` label in the markdown file <Badge text="^1.0.2"/>

diff --git a/docs/README.md b/docs/README.md
@@ -2,9 +2,9 @@
 
 > a vuepress plugin to better supporting image lazy loading
 
-**The plugin will preferentially use native image [lazy-loading](https://caniuse.com/#feat=loading-lazy-attr), if the browser does not support it, it will be implemented through lozad**
+**The plugin will preferentially use native image [lazy-loading](https://caniuse.com/#feat=loading-lazy-attr), if the browser does not support it, it will be implemented through [IntersectionObserver](https://caniuse.com/#feat=intersectionobserver)**
 
-base on [markdown-it-img-lazy](https://github.com/tolking/markdown-it-img-lazy) and [markdown-it-imsize](https://github.com/tatsy/markdown-it-imsize) and [lozad](https://github.com/ApoorvSaxena/lozad.js)
+base on [markdown-it-img-lazy](https://github.com/tolking/markdown-it-img-lazy) and [markdown-it-imsize](https://github.com/tatsy/markdown-it-imsize)
 
 ---
 
@@ -71,18 +71,34 @@ export default {
 
 ## Options
 
-### useLoading
+### useNative
 - Type: `Boolben`
 - Default: `true`
+- Required: `false`
 
 Use the native image lazy-loading for the web
 
 ### selector
 - Type: `string`
 - Default: `lazy`
+- Required: `false`
 
 Default class name for image
 
+### rootMargin
+- Type: `String`
+- Default: `200px`
+- Required: `false`
+
+rootMargin for IntersectionObserver
+
+### prefix
+- Type: `string` `Function`
+- Default: `src => src && src.charAt(0) === '/' && !src.startsWith(ctx.base) ? ctx.base + src.slice(1) : src`
+- Required: `false`
+
+Config prefix for src in images
+
 ## Other
 
 1. [Base URL](https://vuepress.vuejs.org/guide/assets.html#rBase%20URL) already included by default, But it does not include the `<img/>` label in the markdown file <Badge text="^1.0.2"/>

diff --git a/docs/zh/README.md b/docs/zh/README.md
@@ -2,9 +2,9 @@
 
 > 一个为了更好的支持图片懒加载的 vuepress 插件
 
-**该插件将优先使用 [原生](https://caniuse.com/#feat=loading-lazy-attr) 的图片懒加载，如果浏览器不支持将通过 lozad 实现**
+**该插件将优先使用 [原生](https://caniuse.com/#feat=loading-lazy-attr) 的图片懒加载，如果浏览器不支持将通过 [IntersectionObserver](https://caniuse.com/#feat=intersectionobserver) 实现**
 
-基于 [markdown-it-img-lazy](https://github.com/tolking/markdown-it-img-lazy)、 [markdown-it-imsize](https://github.com/tatsy/markdown-it-imsize)、 [lozad](https://github.com/ApoorvSaxena/lozad.js)
+基于 [markdown-it-img-lazy](https://github.com/tolking/markdown-it-img-lazy)、 [markdown-it-imsize](https://github.com/tatsy/markdown-it-imsize)
 
 ---
 
@@ -71,18 +71,34 @@ export default {
 
 ## 配置
 
-### useLoading
+### useNative
 - Type: `Boolben`
 - Default: `true`
+- Required: `false`
 
 是否使用基于原生的懒加载
 
 ### selector
 - Type: `string`
 - Default: `lazy`
+- Required: `false`
 
 默认的懒加载类名
 
+### rootMargin
+- Type: `String`
+- Default: `200px`
+- Required: `false`
+
+设置 IntersectionObserver 的 rootMargin 属性
+
+### prefix
+- Type: `string` `Function`
+- Default: `src => src && src.charAt(0) === '/' && !src.startsWith(ctx.base) ? ctx.base + src.slice(1) : src`
+- Required: `false`
+
+为图片的 src 配置前缀
+
 ## 其它说明
 
 1. 已经默认包含 [基础路径](https://vuepress.vuejs.org/zh/guide/assets.html#%E5%9F%BA%E7%A1%80%E8%B7%AF%E5%BE%84)，但不包括 markdown 文件里面的 `<img/>` 标签 <Badge text="^1.0.2"/>

diff --git a/package.json b/package.json
@@ -1,7 +1,8 @@
 {
   "name": "vuepress-plugin-img-lazy",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "main": "index.js",
+  "type": "commonjs",
   "description": "a vuepress plugin to better supporting image lazy loading",
   "author": "tolking <[email protected]>",
   "license": "MIT",
@@ -19,14 +20,13 @@
   "keywords": [
     "vuepress",
     "vuepress-plugin",
-    "lazy",
+    "lazy-loading",
     "img",
-    "loading",
+    "lazy",
     "data-src"
   ],
   "dependencies": {
-    "lozad": "^1.9.0",
-    "markdown-it-img-lazy": "^1.0.0",
+    "markdown-it-img-lazy": "^1.0.2",
     "markdown-it-imsize": "^2.0.1"
   },
   "devDependencies": {