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

相关推荐
Lhappy嘻嘻12 小时前
Java IO|File 文件操作 + 字节流 / 字符流完整笔记 + 递归删除文件实战
java·笔记·php
2601_9637713715 小时前
How to Scale Your WordPress Store Traffic in 2026
前端·php·plugin
右耳朵猫AI19 小时前
PHP周刊2026W28 | 安全更新、Laravel 13.18、Twig 3.28
开发语言·php·laravel
罗政19 小时前
PDF 批量合并工具:本地 AI 自动排序、识别正文日期与合同编号
数据库·pdf·php
糖果店的幽灵21 小时前
安全测试从入门到精通_网络基础与HTTPS
网络·https·php
2601_9637713721 小时前
WordPress SEO Guide: Boost Rankings Without Technical Jargon
前端·php
大白要努力!1 天前
uni-app 全面入门速查手册
前端·uni-app
日取其半万世不竭1 天前
CS2 服务器搜不到?GSLT、端口和启动参数逐项检查
运维·服务器·php
李剑一1 天前
uni-app x 实现本地 JSON 文件的导入导出(APP端可用)
android·前端·uni-app
2501_915106321 天前
iOS 软件测试工具性能监控、日志分析 KeyMob、Instruments等
android·ios·小程序·https·uni-app·iphone·webview