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

相关推荐
2501_91592143几秒前
没有 iOS 源码的前提下如何进行应用混淆,源码混淆失效后的替代
android·ios·小程序·https·uni-app·iphone·webview
wqdian_com1 小时前
中文域名的准确展示能否堵住网络钓鱼攻击“后门”?
服务器·安全·php
YJlio3 小时前
PsPing 学习笔记(14.7):一条龙网络体检脚本——连通性、延迟、带宽全都要
开发语言·网络·笔记·python·学习·pdf·php
2501_915106324 小时前
Perfdog 成本变高之后,Windows 上还能怎么做 iOS APP 性能测试
android·ios·小程序·https·uni-app·iphone·webview
奶糖 肥晨5 小时前
JS自动检测用户国家并显示电话前缀教程|vue uniapp react可用
javascript·vue.js·uni-app
2501_915106325 小时前
iOS 安装了证书,HTTPS 还是抓不到
android·网络协议·ios·小程序·https·uni-app·iphone
oMcLin6 小时前
如何在 Debian 11 上通过优化 Nginx 与 PHP‑FPM,提高大流量网站的稳定性与响应速度?
nginx·debian·php
南工孙冬梅6 小时前
Linux中安装配置nfs
linux·运维·php
CryptoRzz7 小时前
印度交易所 BSE 与 NSE 实时数据 API 接入指南
java·c语言·python·区块链·php·maven·symfony
2501_916007477 小时前
iOS 自动化上架的工具组合,在多平台环境中实现稳定发布
android·运维·ios·小程序·uni-app·自动化·iphone