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

相关推荐
海天鹰5 小时前
PHP上传文件
android·开发语言·php
2501_915918416 小时前
详解iOS App上架至App Store的全流程步骤与注意事项
android·macos·ios·小程序·uni-app·cocoa·iphone
anyup7 小时前
终于在今天入选了 Gitee GVP,这真值得庆祝~
前端·uni-app·开源
shiyi.十一8 小时前
第7章:无线网络和移动网络 — 知识要点与架构
网络·架构·php
晓梦林9 小时前
[极客大挑战 2019]PHP学习笔记
笔记·学习·php
2401_8949155310 小时前
Geo优化系统源码部署搭建技术——PHP程序开发部署指南
开发语言·php
HH‘HH12 小时前
前端应用的离线暂停更新策略:原理、实现与最佳实践
开发语言·前端·php
虚惊一场13 小时前
撤销为什么只需要 pop:用事件重放实现离线台球计分
微信小程序·uni-app
虚惊一场13 小时前
从一个小程序到一座工具箱:uni-app 分包与 Flask 微服务实践
微信小程序·uni-app
xlq2232213 小时前
高并发服务器day8(含服务器完整架构)
运维·服务器·php