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 小时前
2026年推荐6个AI音乐工具
java·人工智能·python·eclipse·django·php·pygame
计算机学姐4 小时前
基于微信小程序的图书馆座位预约系统【uniapp+springboot+vue】
vue.js·spring boot·微信小程序·小程序·java-ee·uni-app·intellij-idea
中犇科技5 小时前
电商app源码系统推荐|开源 uniapp 商城系统
uni-app
海水冷却9 小时前
uniapp 实现直播功能的完整方案与实战指南
uni-app
m0_7381207210 小时前
渗透测试——Djinn1靶场详细渗透提权过程讲解(绕过黑名单限制,命令执行反弹shell,pyc反编译,代码白盒分析,python沙盒逃逸)
开发语言·python·php
wuxianda103010 小时前
Object-C/Swift/UniApp项目苹果商店上架3天极速解决方案汇报总结
ios·uni-app·objective-c·cocoa·苹果上架
WKK_10 小时前
uniapp 微信小程序使用TextEncoder,arrayBufferToBase64
微信小程序·小程序·uni-app
vx-程序开发10 小时前
PHP书店网站-计算机毕业设计源码05274
开发语言·php·课程设计
whynogome11 小时前
【无标题】
php
众乐乐_200811 小时前
PHP 的进程 fork 机制
开发语言·php