feat: 图片压缩范例
This commit is contained in:
parent
ad7b990413
commit
c71d3b3053
@ -111,6 +111,10 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/demo/img-min/index",
|
||||
"type": "page"
|
||||
},
|
||||
{
|
||||
"path": "pages/index/demo/component-auto-import",
|
||||
"type": "page",
|
||||
|
BIN
src/pages/demo/img-min/after.png
Normal file
BIN
src/pages/demo/img-min/after.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 745 KiB |
BIN
src/pages/demo/img-min/before.png
Normal file
BIN
src/pages/demo/img-min/before.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 245 KiB |
BIN
src/pages/demo/img-min/bg-1.png
Normal file
BIN
src/pages/demo/img-min/bg-1.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.4 MiB |
17
src/pages/demo/img-min/index.vue
Normal file
17
src/pages/demo/img-min/index.vue
Normal file
@ -0,0 +1,17 @@
|
||||
<template lang="">
|
||||
<view class="m-4 text-center">
|
||||
<view class="mb-2 text-orange-500">
|
||||
原始图片是一个很大的,2.5M,build之后生成的图片只有1.1M,体积下降 56%
|
||||
</view>
|
||||
<image :src="bgImg" mode="scaleToFill" />
|
||||
<view class="mb-4">对比图如下2图,如果看不清请看代码原图</view>
|
||||
<image :src="beforeImg" mode="widthFix" class="w-full" />
|
||||
<image :src="afterImg" mode="widthFix" class="w-full" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import bgImg from './bg-1.png'
|
||||
import beforeImg from './before.png'
|
||||
import afterImg from './after.png'
|
||||
</script>
|
1
uni-pages.d.ts
vendored
1
uni-pages.d.ts
vendored
@ -13,6 +13,7 @@ interface NavigateToOptions {
|
||||
"pages/lottery/nine-grid" |
|
||||
"pages/my/index" |
|
||||
"pages/throughout/index" |
|
||||
"pages/demo/img-min/index" |
|
||||
"pages/index/demo/component-auto-import" |
|
||||
"pages/index/demo/mp-weixin-share" |
|
||||
"pages/index/demo/navbar" |
|
||||
|
Loading…
x
Reference in New Issue
Block a user