微信小程序一开始只有1mb的上传大小,后来应广大民众要求加到了2mb,可这对于大一些的小程序可能就不够了,特别是有用到很多图片的就更不够了,那怎么办呢?
==把图片放到线上服务器,引用线上图片地址就好了==
这里我用的是wepy,为了方便图片引入,设置了图片前缀,但在一个wpy文件中,style和script要分别引入
如下
<style lang="less">
@import '../../styles/custom/common.less';
checkin-header:{background: @themeColor url('@{imgHost}/checkin/header.png') no-repeat;}
</style>
<template>
{{imgHost}}
</template>
<script>
import {service} from '../../config.js'
export default class PageTopic extends wepy.page {
data={
imgHost:service.imgHost
}
}
</script>
common.less:
@imgHost:"https://api.51app.cn/webPage/tq/xcx/images";
@themeColor:#ff4f4f;
config.js:
let host = 'https://api.51app.cn'
export const service = {
baseURL: '../../',
imgHost:'https://api.51app.cn/webPage/tq/xcx/images',
apiHost:'https://api.51app.cn/diyapi'
}
export default{
service
}
对于common.less,本来已经在app.wpy引入过了,理论上应该是所有页面都不用再引入的,对于common.less中的一些样式如.loading{...}确实全部页面都有用,但是对于定义的变量如@imgHost:"https://api.51app.cn/webPage/tq/xcx/images";就没用,不得不每个页面都引入common.less
再就是对字体文件,还是要转为base64引入还占了更大的地方,无法引入线上的文件。
网友评论