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 小时前
MacCMSPro版视频影视系统源码_全开源高可用视频平台解决方案
前端·php·php源码
TO_WebNow13 小时前
使用thinkPHP8.x 访问接口提示跨域
前端·php
JSON_L16 小时前
PHP使用Intervention Image图像处理
图像处理·php·intervention
treesforest17 小时前
IP数据库下载完全指南:免费与商业IP定位库对比
网络·数据库·php
原来是猿18 小时前
网络计算器:理解序列化与反序列化(下)
linux·开发语言·网络·网络协议·json·php
原来是猿18 小时前
Linux守护进程(Daemon)完全指南:从原理到实战
linux·运维·服务器·网络·php
阿洛学长21 小时前
更好用的Wordpress二次元主题!Mokore更新1.2啦
php
AIBox36521 小时前
Claude 中转站怎么接入:2026 年国内调用 Claude API 的方法、能力与示例
服务器·开发语言·人工智能·gpt·php·python3.11
xiangxiongfly91521 小时前
uni-app 组件总结
前端·javascript·uni-app
2501_915918411 天前
iOS性能数据监控:从概念到工具实践,让应用运行更流畅
android·macos·ios·小程序·uni-app·cocoa·iphone