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

相关推荐
某公司摸鱼前端5 小时前
uniapp socket 封装 (可拿去直接用)
前端·javascript·websocket·uni-app
还鮟7 小时前
CTF Web PHP弱类型与进制绕过(过滤)
php·ctf
zorro_z7 小时前
PHP语法基础篇(八):超全局变量
php
遗憾随她而去.8 小时前
uniapp 中使用路由导航守卫,进行登录鉴权
前端·uni-app
牧杉-惊蛰12 小时前
uniapp微信小程序css中background-image失效问题
css·微信小程序·uni-app
九分源码15 小时前
基于PHP+MySQL组合开发开源问答网站平台源码系统 源码开源可二次开发 含完整的搭建指南
mysql·开源·php
RainSerein17 小时前
Laravel8中使用phpword生成word文档
word·php·laravel
Little_Code20 小时前
uniapp 使用ffmpeg播放rtsp
ffmpeg·uni-app·rtsp
儿歌八万首20 小时前
uniapp 和原生插件交互
uni-app·交互
pltrue20 小时前
Go 重构案例分享:订单创建逻辑重构
go·php