uniapp 添加分包页面,配置分包预下载

为什么要分包 ?

分包即将小程序代码分成多个部分打包,可以减少小程序的加载时间,提升用户体验

添加分包页面

比较便捷的方法是使用vscode插件 uni-create-view

  1. 新建分包文件夹

    以在我的页面,添加分包的设置页面为例,新建文件夹 src\pagesMember

  2. 在分包文件夹上,添加分包页面

    回车后,即完成分包页面的添加

在 src\pages.json 中自动新增了代码

json 复制代码
  "subPackages": [
    {
      "root": "pagesMember",
      "pages": [
        {
          "path": "settings/settings",
          "style": {
            "navigationBarTitleText": "设置"
          }
        }
      ]
    }
  ],

为什么要配置分包预下载 ?

分包预下载配置可以指定在用户打开指定页面时,预下载指定的分包,可提升进入分包页面的速度,提升用户体验

配置分包预下载

src\pages.json

js 复制代码
  // 配置分包预下载
  "preloadRule": {
    "pages/my/my": {
      "network": "all",
      "packages": ["pagesMember"]
    }
  }

含义为:在打开页面 pages/my/my 时,所有网络下都预下载分包 pagesMember

相关推荐
twcc_come8 小时前
安全策略配置实验报告
开发语言·php
weixin_BYSJ19879 小时前
springboot3家政平台小程序--附源码00904
java·javascript·spring boot·python·django·flask·php
清风programmer11 小时前
H5与小程序通信
前端·vue.js·uni-app
上海安当技术13 小时前
车间电脑指纹登录怎么做?从 FIDO2 公钥体系到统一身份认证的技术拆解
开发语言·电脑·php
大黄说说1 天前
接口频繁超时、报错?后端常见排查思路总结
开发语言·php
Sagittarius_A*2 天前
【RCELABS】Level 1~4 —— 基础篇
靶场·php·ctf·代码审计·rce
海天鹰2 天前
PHP换行
php
2501_915918412 天前
深入对比iOS开发中常用性能监控工具的底层原理与优缺点分析
android·ios·小程序·https·uni-app·iphone·webview
moonsims2 天前
星闪在跨域无人化系统作用
开发语言·php
AI多Agent协作实战派2 天前
AI多Agent协作系统实战(二十三):Agent读HEARTBEAT.md不读AGENTS.md——openclaw的文件加载之谜
前端·数据库·人工智能·uni-app