uniapp 配置小程序分包

这篇具有很好参考价值的文章主要介绍了uniapp 配置小程序分包。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

分包可以减少小程序首次启动时的加载时间

uniapp 配置小程序分包,uniapp,uni-app,小程序

分包页面(例如:商品详情页、商品列表页)。在 uni-app 项目中,配置分包的步骤如下:

1、右键点击根目录,新建,点击创建分包的根目录,命名为 subpkg。
2、在 pages.json 中,和 pages 节点平级的位置声明 subPackages 节点,定义分包相关结构:
{
  "pages": [
    {
      "path": "pages/home/home",
      "style": {}
    },
    {
      "path": "pages/cate/cate",
      "style": {}
    },
  ],
  "subPackages": [
    {
      "root": "subpkg",  // 指定分包的 根目录
      "pages": []        // 存放分包 页面
    }
  ]
}
uniapp 配置小程序分包,uniapp,uni-app,小程序3、在 subpkg 目录上鼠标右键,点击 新建页面 选项,并填写页面的相关信息:

uniapp 配置小程序分包,uniapp,uni-app,小程序

4、注意:分包 pages 内容是自动生成的

uniapp 配置小程序分包,uniapp,uni-app,小程序文章来源地址https://www.toymoban.com/news/detail-682374.html

到了这里,关于uniapp 配置小程序分包的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • uni-app分包预下载

    模块的二级页面,按模块处理成分包页面,有以下好处: 按模块管理页面,方便项目维护。 减少主包体积,用到的时候再加载分包,属于 性能优化 解决方案。 ::: tip 温馨提示 通过 VS Code 插件 uni-create-view 可以快速新建分包页面,自动配置分包路由。 ::: 分包预下载 当用户进

    2024年01月25日
    浏览(53)
  • uni-app、小程序项目,在分包后访问地址无法跳转,出现异常:RangeError: Maximum call stack size exceeded

    使用uni-app开发小程序,由于微信小程序对代码包体积有大小限制,故分包处理,同时也做了分包预加载 分包后,一个点击事件,同一个跳转地址,在浏览器下正常跳转,在微信开发者工具内出现如下报错 出现异常: RangeError: Maximum call stack size exceeded 如图: 原因:很有可能

    2024年02月12日
    浏览(44)
  • uni-app之分包加载和按需注入

    因小程序有体积和资源加载限制,如果都放主包pages里面,一般项目肯定会超过2M,微信小程序的主包或者分包的大小是2M,总体积一共不能超过20M。 主包:即放置默认启动页面/TabBar 页面,以及一些所有分包都需用到公共资源/JS 脚本; 分包:则是根据开发者的配置进行划分

    2024年02月03日
    浏览(46)
  • 【uni-app教程】四、UniAPP 路由配置及页面跳转

    uni-app 页面路由为框架统一管理,开发者需要在pages.json里配置每个路由页面的路径及页面样式。类似小程序在 app.json 中配置页面路由一样。所以 uni-app 的路由用法与 Vue Router 不同,如仍希望采用 Vue Router 方式管理路由,可在插件市场搜索 Vue-Router。 uni-app 有两种页面路由跳转

    2024年01月16日
    浏览(73)
  • uni-app小程序实现音频播放,uniapp播放录音,uniapp简单实现播放录音

    复制到.vue文件即可预览效果 问题 :开发者工具中.onTimeUpdate方法可能会失效! 官方参考:https://uniapp.dcloud.net.cn/api/media/audio-context.html# 其他博客参考:https://blog.csdn.net/weixin_45328705/article/details/114091301 录音实现参考 :https://blog.csdn.net/weixin_43992507/article/details/129857780

    2024年02月12日
    浏览(77)
  • 使用vscode开发配置uni-app(小程序)

    这个文件是用 VsCode 写 uniapp 小程序的步骤笔记 安装Vue脚手架(vue-cli) 通过脚手架创建 uni-app 项目 我们是初学者就直接选择默认模板 创建好后用vscode打开项目 安装vue语法提示插件 vetur 和 vue-helper 安装组件语法提示 初始化npm 从git下载代码块放到项目目录下的 .vscode (没有文件夹

    2024年02月08日
    浏览(76)
  • 小程序-uni-app:uni-app-base项目基础配置及使用/uni-app+vue3+ts+vite+vscode

    目前(20230605)uni-app最新版本(3.8.4.20230531) 一、官网文档 微信开放文档 uni-app官网 二、创建项目 项目目标:vue3+ts+vite+vscode 创建以 typescript 开发的工程(如命令行创建失败,请直接访问 gitee 下载模板) npx degit dcloudio/uni-preset-vue#vite-ts uniapp-base ​ 本文创建成功 ​ 为了验

    2024年02月15日
    浏览(90)
  • 小程序-uni-app:uni-app-base项目基础配置及使用 / uni-app+vue3+ts+vite+vscode

    目前(20230605)uni-app最新版本(3.8.4.20230531) 一、官网文档 微信开放文档 uni-app官网 二、创建项目 项目目标:vue3+ts+vite+vscode 创建以 typescript 开发的工程(如命令行创建失败,请直接访问 gitee 下载模板) npx degit dcloudio/uni-preset-vue#vite-ts uniapp-base ​ 本文创建成功 ​ 为了验

    2024年02月05日
    浏览(507)
  • miniprogram-to-uniapp使用指南(各种小程序项目转换为uni-app项目)

    小程序分类:uni-app qq小程序 支付宝小程序 百度小程序 钉钉小程序 微信小程序 小程序转成uni_app 小程序转为uni_app 小程序转uni_app 小程序转换 工具现在支持npm全局库、HBuilderX插件两种方式使用,任君选择,HBuilderX插件地址:https://ext.dcloud.net.cn/plugin?id=2656 【miniprogram-to-uniapp】

    2024年02月08日
    浏览(55)
  • uni-app 微信小程序全局配置分享好友、朋友圈...

    使用uni-app在实际项目中开发微信小程序,经常会遇到给项目添加分享给微信好友、朋友圈...功能,一般来说要将某个页面分享出去,就要在当前页面添加:  且onShareAppMessage()与onShareTimeline() 与methods同级!!! 官方网址:uniapp.dcloud.io/api/plugins… 这样做虽然实现了分享功能,

    2024年02月11日
    浏览(73)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包