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

相关推荐
星光开发者2 分钟前
基于springboot电动汽车租赁管理系统-计算机毕设 附源码 11217
javascript·spring boot·mysql·django·php·html5·express
RuoyiOffice24 分钟前
SpringBoot+Vue3 实现 OA 公文外来文与归档台账:外部收文、BPM办理、三类公文统一归档
spring boot·微服务·uni-app·vue·ruoyi·anti-design-vue·ruoyioffice
xxjj998a34 分钟前
PHP vs C++:性能与用途全解析
php·laravel
zx28596340020 小时前
Laravel 8.x 核心特性全面解析
php·laravel
Gh0st_Lx1 天前
【6】为什么有了 HTTP/1.1 ,还要 HTTP/2 和 HTTP/3
网络协议·http·php
xingpanvip1 天前
星盘接口开发文档:组合三限盘接口指南
android·开发语言·前端·python·php·lua
云起SAAS1 天前
私域直播系统UniApp源码 多商户商城+直播带货 微信小程序+H5+安卓iOS
android·微信小程序·uni-app·私域直播系统
灰子学技术1 天前
Envoy TCP 层面的 Metric 指标分析
开发语言·网络·网络协议·tcp/ip·php
Johnstons1 天前
TCP Reset(RST)异常是什么?一文讲透连接被动中断的识别方法、适用场景、与超时断开的边界及排查清单
网络协议·tcp/ip·php·es·抓包分析
REDcker1 天前
Linux信号机制详解 POSIX语义与内核要点 sigaction与备用栈实践
linux·运维·php