uniapp 添加分包页面,配置分包预下载

为什么要分包 ?

分包即将小程序代码分成多个部分打包,可以减少小程序的加载时间,提升用户体验

添加分包页面

比较便捷的方法是使用vscode插件 uni-create-view

  1. 新建分包文件夹
    以在我的页面,添加分包的设置页面为例,新建文件夹 src\pagesMember

  2. 在分包文件夹上,添加分包页面
    在这里插入图片描述
    在这里插入图片描述
    回车后,即完成分包页面的添加

在这里插入图片描述
在 src\pages.json 中自动新增了代码

  "subPackages": [
    {
   
      "root": "pagesMember",
      "pages": [
        {
   
          "path": "settings/settings",
          "style": {
   
            "navigationBarTitleText": "设置"
          }
        }
      ]
    }
  ],

为什么要配置分包预下载 ?

分包预下载配置可以指定在用户打开指定页面时,预下载指定的分包,可提升进入分包页面的速度,提升用户体验

配置分包预下载

src\pages.json

  // 配置分包预下载
  "preloadRule": {
   
    "pages/my/my": {
   
      "network": "all",
      "packages": ["pagesMember"]
    }
  }

含义为:在打开页面 pages/my/my 时,所有网络下都预下载分包 pagesMember

相关推荐

  1. uniapp分包

    2023-12-23 06:08:01       35 阅读
  2. uniapp 分包

    2023-12-23 06:08:01       20 阅读
  3. uniapp如何分包加载

    2023-12-23 06:08:01       34 阅读

最近更新

  1. TCP协议是安全的吗?

    2023-12-23 06:08:01       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2023-12-23 06:08:01       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2023-12-23 06:08:01       19 阅读
  4. 通过文章id递归查询所有评论(xml)

    2023-12-23 06:08:01       20 阅读

热门阅读

  1. GO设计模式——16、命令模式(行为型)

    2023-12-23 06:08:01       43 阅读
  2. DotNet Core 在Centos上使用环境变量运行 urls 参数

    2023-12-23 06:08:01       43 阅读
  3. react useMemo的使用

    2023-12-23 06:08:01       34 阅读
  4. FFmpeg 版本gyan.dev和BtbN区别

    2023-12-23 06:08:01       42 阅读
  5. 压力测试(超详细总结)

    2023-12-23 06:08:01       41 阅读
  6. react v-18父组件调用子组件的方法和数据

    2023-12-23 06:08:01       46 阅读
  7. Quartz.net 正则表达式触发器

    2023-12-23 06:08:01       48 阅读
  8. 状态码403什么时候会遇到?怎么解决?

    2023-12-23 06:08:01       43 阅读
  9. 分糖果(周赛)

    2023-12-23 06:08:01       47 阅读
  10. 如何在Node.js中使用Redis实现一个游戏排行榜?

    2023-12-23 06:08:01       41 阅读