uni-app如何优雅的使用云开发?(taro等框架使用云开发同理)
发布于 3 年前 作者 tfeng 1776 次浏览 来自 分享

1、 最近在用uniapp 做 砍价小程序。基于小程序云开发。本来觉得没啥好写的,刚好群友问了,就决定写个笔记。

2、基本操作步骤:

  • 准备一个用uni-app项目
  • 不要用uniapp自带“运行到小程序”功能。
  • 用小程序开发工具,创建云开发项目 dev,定位在uni-app项目的dev文件生成目录。
  • 用小程序开发工具,直接导入uniapp下build目录的项目,无需勾选云开发,回头上传小程序的时候用的是这个目录。
  • 如果你看明白上面的,下面不用看了。
  • tips:以后做开发,只需要打开 dev项目 ,uniapp那边正常运行,就能同步看到模拟效果了。

3、详细操作步骤(以砍价小程序举例):

  • 准备一个用uni-app项目

  • 新项目还没有dev目录所以需要先运行一下(发现个微信截图的bug,截图的时候,菜单挡住了箭头。)

  • 打开uniapp的dev文件夹路径:项目目录/unpackage/dist/dev,删除dev文件夹下的内容。因为小程序新建项目要求空文件夹。

  • 创建云开发小程序,注意给我加了个 -dev 用来标记项目,方便日后管理

  • 创建完成后,会自动生成小程序的文件,如图:

  • 现在点开project.config.json 这个文件夹,用记事本,开发编辑器都可以,修改其中的  

"miniprogramRoot": "miniprogram/", 改成   "miniprogramRoot": "mp-weixin/",

mp-weixin是uni-app 默认的生成目录,如果是其他项目,如 taro,也对应修改即可。每次uniapp修改,都会生成在mp-weixin目录

  • 改完后,如图

  • 然后,记得去uni-app的app.js添加云开发的初始化。

  • 至此,就可以正常开发了。发布的时候,用uniapp发行,再用小程序开发工具导入 build文件,无需新建。直接导入即可,云开发的目录不存在也没有关系的。
  • 导入步骤如下:


会自动填写好数据,无需勾选云开发之类

最终效果:

平时开发,用:砍价-dev,开发完成,用 砍价-build 上传。

回到顶部