导语:这篇主要介绍应用分包和游客模式相关的内容。
# 目录
- 应用分包
- 游客模式
# 应用分包
微信对于小程序的打包压缩后的代码体积是有限制的,网页和 APP 也可以适用分包功能,因此需要进行分包添加以及分包优化。
# 分包添加
在pages.json
文件中添加分包的信息。例如:有一个名叫user
的分包,里面有一个文件是index.vue
,那么分包配置就是:
{
"pages": [
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "首页"
}
}
],
"subPackages": [
{
"root": "user",
"pages": [
{
"path": "index",
"style": {
"navigationBarTitleText": "分包首页"
}
}
]
}
]
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
配置完成后该文件的访问地址就是/user/index
,其中的user
是在根目录下存放的。
# 分包优化
# 添加配置
分包优化的方法是在manifest.json
文件中对应的平台添加以下配置:
例如:mp-weixin
平台下添加分包优化。
{
"mp-weixin": {
"optimization": {
"subPackages": true
}
}
}
1
2
3
4
5
6
7
2
3
4
5
6
7
# 注意事项
- 目前只支持
mp-weixin
、mp-qq
、mp-baidu
、mp-toutiao
、mp-kuaishou
的分包优化; - 分包目录内放置的静态资源不会被打包到主包中,也不可在主包中使用;
- 当某个 js 仅被一个分包引用时,该 js 会被打包到该分包内,否则仍打到主包(即被主包引用,或被超过 1 个分包引用);
- 若某个自定义组件仅被一个分包引用时,且未放入到分包内,编译时会输出提示信息;
# 微信小程序
目前微信小程序分包大小有以下限制:
- 整个小程序所有分包大小不超过 20M;
- 单个分包/主包大小不能超过 2M;
# 游客模式
在一些平台,比如微信小程序和苹果 ios 应用商店,上架的应用一定要提供游客模式才可以进行审核通过。
如何实现游客模式呢,下面就来简单实现一下。
# 服务端配置
可以通过动态配置来打开或关闭游客模式。
例如:默认开启游客模式。
{
"vistor": true
}
1
2
3
2
3
# 客户端配置
客户端根据服务端的配置来设置是否开启游客模式。
# 逻辑分析
- 开启游客模式后,启动应用就应该可以进入到应用程序的主页面,然后可以随意游览和使用,当遇到需要登录才能访问的地方,再跳转到登录页面;
- 关闭游客模式后,启动应用后需要先登录账号,然后才可以访问应用内的页面或者使用应用提供的服务和功能;
# 设置缓存
启动应用获取服务端配置后可以设置缓存数据:
// 接口获取到的数据
let config = {
vistor: true,
};
// 存入本地
uni.setStorage("vistor", config.vistor);
1
2
3
4
5
6
2
3
4
5
6
# 获取缓存
在要访问的页面触发需要登录才能使用的功能之前,先判断是否开启了游客模式,如开启再提示并跳转登录。
// 获取本地游客模式
let vistor = uni.getStorage("vistor");
// 获取接口,如返回401,则需要登录
let login = true;
// 游客模式已开启并且需要登录则跳转登录界面
if (vistor && login) {
uni.navigateTo({
url: "/pages/login",
});
}
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
# 最后
以上就是分包优化和游客模式的主要内容,有不足之处,请多多指正。