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 分钟前
uni-app 实现自定义底部导航
uni-app·notepad++
黑金IT18 分钟前
在PHP8内,用Jenssegers MongoDB扩展来实现Laravel与MongoDB的集成
mongodb·php·laravel
小春学渗透1 小时前
Day107:代码审计-PHP模型开发篇&MVC层&RCE执行&文件对比法&1day分析&0day验证
开发语言·安全·web安全·php·mvc
瑶琴AI前端2 小时前
uniapp实现H5和微信小程序获取当前位置(腾讯地图)
微信小程序·小程序·uni-app
დ旧言~2 小时前
【网络】应用层——HTTP协议
开发语言·网络·网络协议·http·php
follycat2 小时前
[极客大挑战 2019]PHP 1
开发语言·学习·网络安全·php
耶啵奶膘8 小时前
uniapp-是否删除
linux·前端·uni-app
残月只会敲键盘13 小时前
面相小白的php反序列化漏洞原理剖析
开发语言·php
ac-er888813 小时前
PHP弱类型安全问题
开发语言·安全·php
ac-er888813 小时前
PHP网络爬虫常见的反爬策略
开发语言·爬虫·php