2024-02-04 16:00:27 +08:00
|
|
|
|
<route lang="json5">
|
|
|
|
|
|
{
|
|
|
|
|
|
layout: 'demo',
|
|
|
|
|
|
style: { navigationBarTitleText: '图片压缩' },
|
|
|
|
|
|
}
|
|
|
|
|
|
</route>
|
|
|
|
|
|
|
2024-02-19 16:40:19 +08:00
|
|
|
|
<script setup lang="ts">
|
|
|
|
|
|
import testBgImg from './test-bg.png'
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<template>
|
2024-02-04 16:00:27 +08:00
|
|
|
|
<view class="m-4 text-center">
|
|
|
|
|
|
<view class="mb-2 text-orange-500">
|
|
|
|
|
|
原始图片是一个很大的，2.5M，build之后生成的图片只有1.1M，体积下降 56%
|
|
|
|
|
|
</view>
|
2024-02-19 16:40:19 +08:00
|
|
|
|
<!-- #ifdef MP -->
|
2024-02-04 16:00:27 +08:00
|
|
|
|
<image
|
|
|
|
|
|
src="https://cip-shopping-page-0eysug01066a9e-1302818703.tcloudbaseapp.com/fly/img-min/bg-1.png"
|
|
|
|
|
|
mode="scaleToFill"
|
|
|
|
|
|
/>
|
2024-02-19 16:40:19 +08:00
|
|
|
|
<!-- #endif -->
|
|
|
|
|
|
<!-- #ifndef MP -->
|
|
|
|
|
|
<image :src="testBgImg" mode="scaleToFill" />
|
|
|
|
|
|
<!-- #endif -->
|
2024-02-04 16:00:27 +08:00
|
|
|
|
<view class="mb-4">对比图如下2图，如果看不清请看代码原图</view>
|
|
|
|
|
|
<image
|
|
|
|
|
|
src="https://cip-shopping-page-0eysug01066a9e-1302818703.tcloudbaseapp.com/fly/img-min/before.png"
|
|
|
|
|
|
mode="widthFix"
|
|
|
|
|
|
class="w-full"
|
|
|
|
|
|
/>
|
|
|
|
|
|
<image
|
|
|
|
|
|
src="https://cip-shopping-page-0eysug01066a9e-1302818703.tcloudbaseapp.com/fly/img-min/after.png"
|
|
|
|
|
|
mode="widthFix"
|
|
|
|
|
|
class="w-full"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</template>
|
