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

相关推荐
盛世宏博北京4 小时前
高效环境管控:楼宇机房以太网温湿度精准监测系统方案
开发语言·数据库·php·以太网温湿度变送器
Whisper_Sy5 小时前
Flutter for OpenHarmony移动数据使用监管助手App实战 - 应用列表实现
android·开发语言·javascript·flutter·php
模型时代7 小时前
StealC恶意软件控制面板安全漏洞暴露威胁行为者操作
安全·web安全·php
2501_915918419 小时前
如何在iPad上找到并打开文件夹的完整指南
android·ios·小程序·uni-app·iphone·webview·ipad
qhqh31010 小时前
OPENSTACK基础的网络实验
网络·php·openstack
云游云记10 小时前
php 防伪溯源项目:防伪码生成与批量写入实践
mysql·php·唯一字符串
007php00713 小时前
mac笔记本中在PHP中调用Java JAR包的指南
java·ide·python·面试·职场和发展·pycharm·php
weixin_6383031113 小时前
uniapp组合式和选项式
javascript·vue.js·uni-app
木子啊16 小时前
UniApp Base64上传终极解决方案
uni-app·base64·base64转图片·base64上传
2501_9159184116 小时前
Wireshark、Fiddler、Charles抓包工具详细使用指南
android·ios·小程序·https·uni-app·iphone·webview