@kwai-explore/picture.vue - npm Package Compare versions

Comparing version 0.0.4 to 0.0.5

package.json

 {
   "name": "@kwai-explore/picture.vue",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "type": "module",
@@ -5,0 +5,0 @@ "scripts": {

README.md

@@ -53,23 +53,6 @@ # @kwai-explore/picture.vue
 
-### 安装依赖
-
-`pnpm add @kwai-explore/picture`
-
 ### 在代码中使用
 
-> Picture 组件接受的属性跟 `img` 相同
+> Picture 组件接受的属性跟 `img` 相同，唯一的例外是 `src` 接收一个数组，一个例子是
 
-```vue
-<script setup lang="ts">
-import Picture from '@kwai-explore/picture';
-import examplePic from './components/example.jpg?preset=modern';
-</script>
-
-<template>
-  <Picture :src="examplePic"></Picture>
-</template>
-```
-
-数据不能用插件生成时（比如接口种的数据），样例 `src` 属性是(注意顺序)
-
 ```json
@@ -89,2 +72,15 @@ [{
 
+在我们配置好 `vite-plugin-image-presets` 之后，可以直接在 import 图片的语句后面加一个 query，产出的数据就是上面需要的格式。
+
+```vue
+<script setup lang="ts">
+import Picture from '@kwai-explore/picture';
+import examplePic from './components/example.jpg?preset=modern';
+</script>
+
+<template>
+  <Picture :src="examplePic"></Picture>
+</template>
+```
+
 完整支持的属性
@@ -95,4 +91,4 @@
   src: ImgHTMLAttributes[];
-  // color 会展示一个渐变色块的 loading 效果，加上 fade-in 的加载成功的渐变
-  placeholder?: 'empty' | 'color';
+  // 默认是empty。 color 会展示一个渐变色块的 loading 效果，加上 fade-in 的加载成功的渐变效果。
+  placeholder: 'empty' | 'color';
 }
@@ -99,0 +95,0 @@ ```

No alert changes

Improved metrics

Total package byte prevSize

7531

increased by0.9%

Worsened metrics

Number of lines in readme file

115

decreased by-3.36%

No dependency changes