文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

uniapp微信小程序分包

2023-09-10 08:46

关注

目录

一. 分包的概念

1. 什么是分包

2. 分包的好处

3. 分包后项目的构成

4. 分包加载规则

5. 分包体积限制

二. 分包的方法

1. 分包后的目录结构

2. 配置manifest.json

3. 配置pages.json

4. 全局修改分包文件路径


一. 分包的概念

1. 什么是分包

分包指的是把一个完整的小程序项目,按照需求划分为不同的子包,在构建时打包成不同的分包,用户在使用时按需进行加载。

2. 分包的好处

1. 优化小程序首次启动多个消灾时间2. 方便团队开发,解耦协作

3. 分包后项目的构成

一个主包:一般只包含项目的启动页面或 TabBar 页面、以及所有分包都需要用到的一些公共资源多个分包:只包含和当前分包有关的页面和私有资源

4. 分包加载规则

在小程序启动时,默认会下载主包并启动主包内页面,当用户进入某个页面时,客户端会把对应分包下载下来,下载完成后再进行展示

5. 分包体积限制

1. 整个小程序所有分包大小不超过20M(主包+所有分包)2. 单个分包/主包大小不能超过2M

二. 分包的方法

1. 分包后的目录结构

    ├── pages       // 主包    │   ├── index    │   └── logs    ├── packageA        // 分包A    │   └── pages    │       ├── cat    │       └── dog    ├── packageB        // 分包B    │   └── pages    │       ├── apple    │       └── banana    ├── manifest.json       // 配置项    └── pages.json      // 页面路径

2. 配置manifest.json

"mp-weixin":{    "optimization":{      "subPackages":true // 开启分包优化    }}

3. 配置pages.json

在pages.json中新建"subPackages"数组,"preloadRule"对象1. "subPackages"数组中包含两个参数:    1.root:为子包的根目录    2.pages:子包由哪些页面组成,参数同pages注意:主包和分包是不能在同一目录下,所以在构建项目时,要考虑目录结构,以便后期进行分包2. "preloadRule"中,key 是页面路径,value 是进入此页面的预下载配置    1. network指定网络下预下载可选wifi/all(非必填)    2. packages进入也买你后预下载的分包(必填)
{  "pages": ["pages/index"],   // 主包内页面  "subpackages": [    {      "root": "packageA",    // 分包A      "pages": [        {          "path" : "pages/cat"        },        {          "path" : "pages/dog"        }      ]    },    {      "root": "packageB", // 分包B      "pages": [        {          "path" : "pages/apple"        },        {          "path" : "pages/banana"        }      ]    }  ],  "preloadRule": {    // 分包预载配置     "pages/index": {    // 在进入小程序pages/index页面时,由框架自动预下载分包A、分包B      "network": "all",      "packages": ["packageA","packageB"]    }  }}

4. 全局修改分包文件路径

webstorm 可通过 ctrl+shift+R 替换所有路径

来源地址:https://blog.csdn.net/weixin_45995139/article/details/129929026

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-移动开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯