开发准备
个人账号入驻
使用自己的支付宝账号，登录到开放平台（https://open.alipay.com/platform/developerIndex.htm），选择“自研开发服务”，填写个人信息，即可完成入驻。
开发工具下载
https://opendocs.alipay.com/mini/ide/download 提供了开发工具的下载链接。
关于alsc-mor
alsc-mor 是本地生活自己的跨段开发方案，可以像开发支付宝小程序那样开发小程序，并且可以使用它提供的特有的能力。
开发过程
参考模板
支付宝小程序的创建提供了包含一定功能的模版，可以基于模板来了解它的使用。
开始开发
通过npm install安装依赖包，参考package.json中的命令来启动本地的小程序开发。
组件使用
小程序提供了很多可用的组件，可以参考 这里 选择合适的组件。
接口调用
my.request 是支付宝封装的接口调用的api，和平时调用ajax并无太多差异。
发布线上
小程序是用完即走的，因此App中打开小程序必定依赖一个“小程序的应用集市”。在本地生活这个集市就是 workcenter文档。我们需要在 workcenter 上
- 创建应用，包含了小程序主体、投放客户端、Git仓库地址等重要信息；
- 创建迭代，每个迭代又分为 开发/预发/发布阶段，目前预发阶段被动当作测试环境使用。
注意：workcenter中创建迭代，注意分支管理，是选自己的分支，还是默认新建分支。
调试方法
除了IDE上调试小程序外，我们还可以
- 发布到测试环境，然后用测试版本的App来打开小程序
- 将本地小程序的dist包，转化为二维码后，使用测试版本的App来扫码打开小程序
测试环境调试
本地IDE要能跟workcenter创建的小程序关联起来，需要workcenter项目的体验成员中添加，然后在支付宝确认。
说明：IDE能识别该小程序可以构建的目的地，需要依赖 支付宝、workcenter、骑士App的打通，即：IDE怎么知道关联的小程序可以投放到哪里。截止文档日期（8月20日）骑士App和支付宝确定的时间是 9月份配合接入
本地dist包扫码
- 在debug中插件build log，找到打包出来的dist.war，使用zip命令将其打包为dist.zip
- 找到一个文件oss上传服务，将dist.zip上传，然后得到下载地址
- 在下载地址后拼接
?_ariver_appid=ali&_debug=true&page=入口页面地址 - 将3中得到的地址，基于二维码生成工具，生成二维码
- 使用骑士App的扫码功能，选择“小程序打开”
应用实践
如何设定底部的tab栏目？
答：参考基于模版生产的例子，在app.json中指定icon和名字
如何实现点击输入框后跳转到新页面？
答：提供了组件
如何实现轮播图
答：swiper组件提供了轮播图效果；image组件(不是img)提供了图片的实现，mode可以决定缩放尺度，结合自身宽高100%来使用
如何实现数据请求？
答：my.request 是支付宝封装的接口调用的api
参考文档
若有收获，就点个赞吧
0 人点赞
