一 研发流程
1-1 小程序注册
1-2 微信公众平台配置
1-2-1 基本信息配置
1-2-2 成员管理
1-2-3 开发管理
-
服务器域名配置包括 request、socket、uploadFile、downloadFile域名配置, 了解域名配置
-
业务域名配置:配置为业务域名后,可调用web-view组件在小程序中打开,查看详情
-
扫普通链接二维码打开小程序,设置普通链接二维码跳转小程序的规则,配置完成后开发人员可进行调试并发布现网。 详情请点击查看 开发文档
-
接口设置:如果小程序需要使用收货地址、地图、地理位置时开通对应接口权限并在开发者工具中进行接口配置:
-
微信公众平台申请开通权限
-
开发者工具,app.json增加接口使用配置,如需要选择地址、获取位置
app.json
-
{
...
"requiredPrivateInfos": [
"chooseAddress",
"getLocation"
],
...
}
1-2-4 其他常用功能接入
-
微信支付
-
订阅消息
1-2-5 关联配置:设置 - 关联设置
-
微信开放平台帐号:绑定微信开放平台帐号后,该小程序可与帐号下的移动应用、网站应用、公众号及其他小程序之间通过unionID机制统一用户账号。了解详情
-
关注公众号:用户扫码使用小程序时,即可展示当前公众号,用户可直接关注公众号。查看详情
-
公众号关联小程序:公众号关联小程序后,将可在自定义菜单、模板消息、客服消息等功能中使用小程序。图文消息中可直接使用小程序卡片、链接、图片素材,无需关联小程序。
登录公众号后台 - 小程序 - 小程序管理 - 添加 - 关联小程序
1-3 项目创建及配置
1-3-1 新建、导入小程序
-
导入已存在的小程序,或者新建小程序。新建小程序依次填写项目名称、项目目录、appID、语音、模板等等。
-
调整目录接口,为了项目代码结构的美观,以及源码与配置文件的隔离,可以调整源码目录结构
-
手动新建源码根目录如:src,并将以下源码文件调整到src目录下
-
project.config.json 中指定小程序根目录
project.config.json
{ ... "miniprogramRoot": "src/", ... }
-
1-3-2 npm支持
- 小程序尽量轻量化,从小程序基础库版本 2.2.1 或以上、及开发者工具 1.02.1808300 或以上开始,小程序支持使用 npm 安装第三方包。此文档要求开发者们对 npm 有一定的了解,因此不会再去介绍 npm 的基本功能。如若之前未接触过 npm,请翻阅 官方 npm 文档 进行学习。
-
由于调整了源码的位置,需自定义 node_modules 和 miniprogram_npm 位置的构建 npm 方式,如为调整源码位置,则使用默认配置即可,以下为自定义配置:
project.config.json
{ ... "setting": { ... "packNpmRelationList": [ { "packageJsonPath": "/package.json", "miniprogramNpmDistDir": "./src/" } ] ... } ... }
注:在小程序中使用 npm 包前,需先构建 npm
1-3-3 vant-ui 支持
1-3-4 登录拦截
1-3-5 eslint、stylelint、comitlit等配置
二、版本管理
2-1 环境管理
小程序运行环境分为开发版、体验版、正式版。根据不同的运行环境,我们可以配置不同的服务域名。如:
config.js
// envVersion 运行环境
const { miniProgram: { envVersion } } = wx.getAccountInfoSync()
const ENV_VERSION = {
DEVELOP: 'develop', // 开发版
TRIAL: 'trial', // 体验版
RELEASE: 'release', // 线上版
}
// 诊后管理域名地址
const DOMAIN_MAP = {
[ENV_VERSION.DEVELOP]: 'https://dev.com',
[ENV_VERSION.TRIAL]: 'https://test.com',
[ENV_VERSION.RELEASE]: 'https://prod.com',
}
// 获取当前服务域名
const getCurrentDomain = (MAP) => {
if (envVersion in MAP) {
return MAP[envVersion]
}
return MAP[ENV_VERSION.DEVELOP]
}
// 当前接口base_url
export const BASE_URL = `${getCurrentDomain(DOMAIN_MAP)}/api`
2-2 发布流程
不同于H5部署在具体的服务器,小程序产物只能通过开发者帐号来管理。一个开发者账号只能上传一份代码(产物)
-
上传代码:选择更新类型,版本号,项目备注。上传之后的代码可以在微信公众平台 - 管理 - 版本管理中查看。
-
选择体验版,供测试同事进行测试
-
版本审核,选择开发版本提交审核
-
灰度发布,可以选择按照微信号,发布比例等进行灰度发布。进行线上环境测试。
-
全量发布,提升发布比例100%即可。