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 小时前
为何VMware上云之路充满挑战?
运维·服务器·php
2501_915909062 小时前
深入解析Mock.js:功能、应用及实战案例,提升前端开发效率
android·ios·小程序·https·uni-app·iphone·webview
于先生吖2 小时前
前后端分离体育服务项目,场馆计费+线下赛事排行小程序部署开发教程
java·小程序·uni-app
蜡台3 小时前
Uniapp 实现预览pdf 文件
pdf·uni-app·pdfh5
vickycheung34 小时前
RK182X 如何在 RK3588 上进行应用测试
开发语言·php
taocarts_bidfans4 小时前
后端开发实战:外贸独立站询盘接口防刷与数据安全优化方案
php·独立站·外贸独立站·taoify
不想吃饭e4 小时前
uniapp-图片,视频上传组件封装
java·uni-app·音视频
marsh02066 小时前
60 openclaw与物联网:连接物理世界的智能应用
开发语言·物联网·青少年编程·php·技术美术
zzqssliu7 小时前
Taocarts库存锁定机制优化:彻底解决跨境代购商品超卖问题
java·linux·javascript·php
dog2508 小时前
科斯定理与平坦随机网络的自然秩序
开发语言·网络·php