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

相关推荐
学习3人组11 小时前
思科Packet Tracer 7.4 生成树协议(STP)配置与安全防护上机讲义
网络·安全·php
vx-程序开发12 小时前
基于机器学习的动漫可视化系统的设计与实现-计算机毕业设计源码08339
java·c++·spring boot·python·spring·django·php
imuliuliang12 小时前
Laravel6.x核心特性全解析
android·php·laravel
jingling55513 小时前
uni-app农场地图——高德 JS API 实现全解析(天地图影像作为layers)
uni-app
谢白羽16 小时前
agent memory论文解析一:解析项目(a-mem)
开发语言·php·论文·agent·a-mem·实际项目
2501_9160088918 小时前
Mac 上生成 AppStoreInfo.plist 文件,App Store 上架
android·macos·ios·小程序·uni-app·iphone·webview
__zRainy__19 小时前
uni-app 全局容器实战系列(四):全局容器动态调用设计
uni-app
轻刀快马19 小时前
讲透分布式系统的演进史与核心架构
开发语言·架构·php
zb2006412019 小时前
Laravel5.x核心特性全解析
android·spring boot·php·laravel
zhangfeng113319 小时前
ThinkPHP5 事件系统的标准最佳实践 事件系统的完整设计逻辑tags.php tags.php(事件地图)
android·开发语言·php