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

相关推荐
lhldsg6 小时前
智慧场馆解决方案小程序开发实战:从架构设计到部署指南
java·小程序·uni-app
Casual7 小时前
【网络基础进阶】:看懂子网划分与 VLAN
开发语言·网络·php
skiyee7 小时前
🚀 用 17 行代码给 UniApp 加上全局登录拦截
前端·uni-app
0xBADCODE9 小时前
CTF Writeup 合集
安全·web安全·网络安全·系统安全·密码学·php·ctf
IPdodo_11 小时前
静态 IP 访问异常排查:403/429 归因与迁移验收
服务器·网络·数据库·python·网络协议·php·性能测试
Mark1085912 小时前
【踩坑】Uni-app微信小程序自定义组件在 Flex 布局中未铺满整行
微信小程序·小程序·uni-app
砚凝霜12 小时前
【软考信息安全】第二章 网络攻击基础与常见技术方法
网络·安全·php
XR12345678813 小时前
办公组网像“看病“:先问诊,再选型
开发语言·php
JaguarJack15 小时前
现在就值得尝试的 5 个 Laravel 新包
后端·php·laravel·服务端
BingoGo15 小时前
现在就值得尝试的 5 个 Laravel 新包
后端·php