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 小时前
Dubbo序列化异常终结指南:从精准诊断到根治与防御
开发语言·前端·微服务·架构·php·dubbo·safari
霸王大陆1 小时前
《零基础学 PHP:从入门到实战》模块十:从应用到精通——掌握PHP进阶技术与现代化开发实战-5
android·开发语言·php
不如摸鱼去1 小时前
uni-app 也能远程调试?使用 PageSpy 打开调试的新大门!
前端·小程序·uni-app
霸王大陆2 小时前
《零基础学 PHP:从入门到实战》模块十:从应用到精通——掌握PHP进阶技术与现代化开发实战-3
开发语言·php
霸王大陆2 小时前
《零基础学PHP:从入门到实战》教程-模块七:MySQL 数据库基础-5
数据库·mysql·php
ljh5746491193 小时前
thinkphp8 执行 php think 命令的时候指定日志存储路径
php
翼龙云_cloud3 小时前
腾讯云渠道商:腾讯云轻量服务器和CVM有什么差异?
运维·服务器·云计算·php·腾讯云
万岳软件开发小城3 小时前
开发一套私域直播 APP/Web/小程序需要哪些核心模块?完整技术清单来了
小程序·php·直播带货系统源码·直播带货软件开发·私域直播系统源码·私域直播平台搭建·私域直播软件开发
小李独爱秋3 小时前
计算机网络经典问题透视:简述一下TCP拥塞控制算法中的拥塞避免算法
服务器·网络·tcp/ip·计算机网络·php
蒲公英源码4 小时前
基于PHP+Nginx+Redis+MySQL社区生活服务平台
javascript·vue.js·mysql·php