微信小程序微信小程序开发者微信小程序开发

小程序开发技术总结

2018-07-20  本文已影响8人  w如弈如意c

这一个月,主导开发了公司的第一款小程序,由于之前没有相关开发经验,所以走了不少弯路,写这篇文章对这一个月的开发流程进行自我总结。
在正式开发小程序之前,花了两天时间看了小程序的官方文档,看完第一印象是:这不就是vue的开发模式吗?于是想会不会有人用vue的方式来开发小程序,果然有人写了个框架wepy,让开发小程序写法更贴近vue,主要看中其支持npm,于是决定用wepy进行开发


创建wepy项目

wepy本地运行项目步骤如下:

首先gitLab拿去代码,进入根目录npm install,然后npm run dev生成dist文件,在开发者工具中就打开小程序项目调试,将项目目录选择dist,即可实时看到调试效果

2. 项目目录介绍:

image.png

开发过vue的话,这个配置很类似

3. 项目上线注意事项:

4. 小程序如何测试:

5. 我写小程序代码配置:

项目公共配置放在app.wepy里面,包括了授权、验证、登录以及获取用户信息
请求链接随项目环境切换,公司为了解决后台域名一个月只能改一次的限制,搞了一个花生壳域名,不同环境指向不同域名,这样就不需要没切换一个环境,就需要小程序后台改域名,太麻烦

相关文档:

小程序:https://developers.weixin.qq.com/miniprogram/dev/

Wepy:https://tencent.github.io/wepy/document.html

另外,发现一个小程序的bug:input组件在工具上调试正常,但在手机上预览或者体验版时,将光标移到最前面,点击删除,e.detail.value变为了空,问了和社区官方,明显是个bug(手动狗头)..。。bug链接:https://developers.weixin.qq.com/blogdetail?action=get_post_info&docid=000e824805c778b810175857a5b000&commentid=0002605d888ff0ea6d1700b69510&token=425717196&lang=zh_CN

上一篇 下一篇

猜你喜欢

热点阅读