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

相关推荐
东宇科技7 小时前
让网页执行cmd命令
php
2501_916007478 小时前
Bundle ID 注册与管理 App ID 创建指南 命名规则 权限开关与删除注意事项
android·ios·小程序·https·uni-app·iphone·webview
持敬chijing9 小时前
PHP开发-环境搭建-安装phpstudy-vscode工具
开发语言·vscode·php
MC皮蛋侠客10 小时前
TDengine C++ 系列(6):高性能写入——参数绑定、批量与 Schemaless
c++·php·tdengine
Hello_Damon_Nikola10 小时前
AC7911从入门到精通
开发语言·嵌入式硬件·物联网·php
sbjdhjd13 小时前
大三网安秋招核心学习前言(AI 安全 + Web 漏洞 + 内网渗透全考点)
人工智能·网络协议·学习·安全·网络安全·开源·php
运维行者_13 小时前
企业带宽监控工具实战:网络流量分析与异常排查的5个关键能力
运维·服务器·开发语言·网络·分布式·后端·php
PedroQue9914 小时前
uni-app路由插件化:解锁高效开发新姿势
前端·uni-app
吴声子夜歌14 小时前
正则指引——PHP
开发语言·正则表达式·php
Claire_8814 小时前
企业文件管理系统选型技术框架与主流产品对比分析
开发语言·php