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

相关推荐
小蒜学长1 小时前
基于SpringBoot+uni-app的闪洁家政系统的设计与实现(代码+数据库+LW)
java·spring boot·后端·uni-app·家政服务
修船大队长2 小时前
CanNm 从休眠唤醒后重复消息报文的周期与数量分析
开发语言·php
李纲明3 小时前
WordPress 安全加固基线:更新策略、文件权限、登录面收缩和备份验证(含回滚注意)
运维·安全·php·wordpress
Novproxy_Z3 小时前
IPv4 与 IPv6 代理在跨境自动化场景下的选型与风险
运维·自动化·php
anyup_前端梦工厂3 小时前
uni-app 模板 Starter 一键清理 Skill 发布
前端·人工智能·uni-app
kimnoic4 小时前
PHP 8.3 数据库备份失败怎么排查
开发语言·php
CRMEB系统商城4 小时前
CRMEB开源商城系统(PHP)v8.0,打造全新AI二开商城底座!
开发语言·人工智能·小程序·开源·php
云川之下4 小时前
【存储】搭建nfs 存储示例
开发语言·php
anyup_前端梦工厂4 小时前
将uni-app工程迁移uni-app x,AI 能帮我们做什么?
前端·人工智能·uni-app
天空属于哈夫克35 小时前
企业微信消息回调处理:如何避免慢查询拖垮整个服务?
数据库·php·企业微信