小程序

135 阅读3分钟
├── components                             	// 组件
│   ├── common                          	// 常用组件(搜索框、日历筛选)
│   ├── moudle                         		// 写字板签名、蒙层引导
├── config                                  
│   ├── baseUrl.js                          // 基础配置(域名、系统信息等)
│   ├── common.js                           // 通用js(小程序更新、app缓存、扫码、定位等)
│   ├── componentConfig.js                  // app升级配置接口
│   ├── h5Utils.js                          // h5通用js(包含h5公众号登录等)
│   ├── wechatLogin.js                     	// 小程序登录授权js
│   └── request.js                          // 接口拦截响应配置(基于uview配置)
├── pages                                   // 项目主包(tabbar底部导航栏)
│   ├── index                               // 首页
│   ├── my                                  // 个人中心
├── pagesPackage_product                    // 项目分包1-生产管理
│   └── workSheet                           // 工单
│   └── ...
├── pagesPackage_material                 	// 项目分包2-物料管理
│   └── warehouse                           // 仓库
│   └── ...
├── static                                  // 图片文件
│ ├── iconfont                        	// 阿里图标库(统一使用公司账号)
│ ├── image                       		// 项目图片
├── store                                   // vuex,通用数据管理
├── style
│ └── common.scss                         // 公共样式文件
├── unpackage                               // 项目编译后的文件
├── uni.scss                              	// 方便整体控制应用的风格,按钮颜色、边框风格
├── App.vue                                 // 项目主界面
├── main.js                                 // 程序入口文件,加载各种公共组件
├── manifest.json                           // uni-app项目类型及环境配置
├── pages.json                              // 项目路由及项目界面配置
├── README.md                               // 项目介绍md
└── template.h5.html                        // h5自定义模板(调整页面 head 中的 meta 配置,补充 SEO 相关的一些配置(仅首页),加入百度统计等三方js)

小程序

对小程序进行分包,优化小程序首次启动下载时间

小程序启动时,默认会下载主包并启动主包页面,当用户进入分包内的某个页面时,客户端会将对应的分包下载并展示,实现按需加载

注意:目前小程序分包大小有以下限制:

  • 整个小程序所有分包大小不超过 20M
  • 单个分包/主包大小不能超过 2M

小程序的版本

权限说明
开发版本使用开发者工具,可将代码上传到开发版本中。 开发版本只保留每人最新的一份上传的代码。 点击提交审核,可将代码提交审核。开发版本可删除,不影响线上版本和审核中版本的代码。
体验版本可以选择某个开发版本作为体验版,并且选取一份体验版。
审核中版本只能有一份代码处于审核中。有审核结果后可以发布到线上,也可直接重新提交审核,覆盖原审核版本。
线上版本线上所有用户使用的代码版本,该版本代码在新版本代码发布后被覆盖更新。

性能优化:

  1. 静态资源尽量放在服务器上,不占用本地资源空间
  2. 如果不是视图所需要的变量,就不定义在data里面,可在外部定义变量或者直接挂载在vue实例上,以避免造成资源浪费
  3. 减少组件数量、减少节点嵌套层级,深层嵌套的节点在页面初始化构建时往往需要更多的内存占用,并且在遍历节点时也会更慢些,所以建议减少深层的节点嵌套
  4. 避免视图层和和逻辑层频繁进行通讯

命名规则

  • 文件夹和文件命名使用小驼峰

  • 项目分包命名 pagesPackage_菜单名称

  • 图片命名以 名词_功能命名划分

    • btn_:按钮 如: btn_confirm (确认按钮图片)