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 小时前
【计算机网络】子网掩码与子网划分计算(含CIDR表示法)
服务器·笔记·计算机网络·php
EatFan4 小时前
Java接入支付宝 JSAPI 支付保姆教程(二):流程讲解与前后端代码讲解
前端·spring boot·后端·微信小程序·小程序·uni-app
cc_yy_zh6 小时前
学习使用kali抓包
服务器·学习·php
ao-weilai8 小时前
Linux网络编程:网络知识基础
linux·网络·php
clz131452112 小时前
设备反欺诈的四大支柱:从设备指纹到关联图谱
开发语言·php
PHP实战开发录17 小时前
PHP脚本手动能跑定时任务却失败
开发语言·php·开发
彧azz1 天前
图的存储结构详解:邻接矩阵的原理、实现与应用
开发语言·数据结构·学习·php
bug总结1 天前
uniapp vue3全局方法注册使用
前端·javascript·uni-app
CRMEB系统商城1 天前
CRMEB标准版系统(Java)v3.1正式发布
java·spring·微信小程序·php·教育电商
hui-梦苑1 天前
[PHP]轻量主题函数WordPress 集成 KaTeX 数学公式渲染
开发语言·php·wordpress·katex