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

相关推荐
星辰烈龙4 小时前
黑马程序员JavaSE基础加强d5
服务器·网络·php
一壶纱4 小时前
UniApp + Pinia 数据持久化
前端·数据库·uni-app
No0d1es4 小时前
2025年12月 GESP CCF编程能力等级认证Python三级真题
开发语言·php
哥只是传说中的小白4 小时前
Nano Banana Pro高并发接入Grsai Api实战!0.09/张无限批量生成(附接入实战+开源工具)
开发语言·数据库·ai作画·开源·aigc·php·api
亚历山大海5 小时前
PHP HTML 实体(HTML Entities)没有被正确解码导致< 和 δ 等字符被转换
开发语言·html·php
酒醉的胡铁9 小时前
uniapp解决video组件在ios上全屏页面旋转90度,组件旋转180度
ios·uni-app
二等饼干~za8986689 小时前
碰一碰发视频系统源码搭建部署技术分享
服务器·开发语言·php·音视频·ai-native
. . . . .10 小时前
WordPress开发到部署
php
成为你的宁宁10 小时前
【Zabbix 自定义监控全流程实战指南(附图文教程):从语法基础到内存传参、PHP-FPM 服务、Web 场景监控配置】
php·zabbix
catchadmin10 小时前
PHP 异步与多线程 从 TrueAsync 展望未来
php