智能小程序开发保姆级教程

最新推荐文章于 2024-07-11 15:38:26 发布

IoT砖家涂拉拉

最新推荐文章于 2024-07-11 15:38:26 发布

阅读量949

点赞数 20

文章标签： App API SDK OEM NVM 小程序物联网

本文链接：https://blog.csdn.net/Ms_Smart/article/details/137040186

版权

一、搭建环境

前置条件

在开发小程序之前，请确保电脑上已经安装node运行环境。可前往Node.js官网下载安装。

安装编辑器

面板小程序开发前，请您按需自行下载安装下列推荐的编辑器：

Visual Studio Code：（推荐）自带格式化、代码跳转等常用功能，社区贡献与活跃度较高。
WebStorm：集成度较高的 Tuya MiniApp Tools 。
Sublime Text：小巧轻便。
Atom：小巧轻便。

安装 App

如果需要安装特定的 App 版本，请通过涂鸦 IoT 开发平台提交工单联系我们，寻求支持。

iOS:

前往 App Store 上的 “智能生活”，或通过手机上官方 App Store 应用下搜索 智能生活 App 并点击下载安装即可。

安卓:

前往应用宝上的 ”智能生活“，或在手机端通过各大厂商提供的应用商店下搜索 智能生活 App 并点击下载安装即可。

安装 Tuya MiniApp Tools

Tuya MiniApp Tools 可以帮助您创建、开发、调试、上传小程序项目。

前往 Tuya MiniApp Tools 下载并安装 Tuya MiniApp Tools 的最新版本。

安装 NVM

NVM 可以帮助您管理多 Node 版本，注意首次安装，需要根据提示设置环境变量

打开终端。

安装 NVM。

<span style="background-color:hsl(var(--nextra-primary-hue)var(--nextra-primary-saturation)39%/.05)"><code>	<span style="color:var(--shiki-token-function)">curl</span> <span style="color:var(--shiki-token-string)">-o-</span> <span style="color:var(--shiki-token-string)">https://raw.githubusercontent.com/nvm-sh/nvm/v0.36.0/install.sh</span> <span style="color:var(--shiki-token-keyword)">|</span> <span style="color:var(--shiki-token-function)">bash</span></code></span>

输入 nvm -v，确认 NVM 已正常安装，若输出版本号，则表明安装成功（检查 Node.js 版本号在 16.0.0 以上，若低于 16.0.0，则需要安装更高版本，您可参考 4），若报错 nvm: command not found，您可参考文末常见问题的解决方法。
输入nvm install 16.20.2 ，安装 Node.js 16.20.2 版本。

（可选）支持通过 nvm use 命令切换至指定 Node.js 版本。（建议安装 Node.js 16.20.2 及以上版本。）

<span style="background-color:hsl(var(--nextra-primary-hue)var(--nextra-primary-saturation)39%/.05)"><code>	<span style="color:var(--shiki-token-function)">nvm</span> <span style="color:var(--shiki-token-string)">use</span> <span style="color:var(--shiki-token-constant)">16.20</span><span style="color:var(--shiki-token-string)">.2</span></code></span>

安装 Yarn

如果已安装过 yarn 或者已使用 npm、pnpm 等依赖管理工具，可忽略本内容

打开终端。
输入npm install -g yarn，安装 Yarn。
（可选）输入 yarn -v ，确认 Yarn 已正常安装。

二、注册入驻

注册涂鸦开发者账号。

三、初始化工程

您需要拥有涂鸦开发者 IoT 账户，然后以开发者身份入驻 Tuya MiniApp 开发者平台，才能创建小程序。

登录 Tuya MiniApp 开发者平台，可以看到小程序列表页面。
在列表页面，单击创建按钮。
填写小程序名称、头像、类型等相关信息，然后单击确定。

四、开发调试

1. 新建项目 & 关联小程序

启动 Tuya MiniApp Tools ，登录开发者 IoT 账号，新建小程序。
根据提示设置 项目路径、项目名称、关联智能小程序，单击确认，进入主界面。
关联智能小程序, 是指您需要先拥有 Tuya MiniApp 开发者平台中对应智能小程序的开发者权限。然后, 在 Tuya MiniApp Tools 中新建或导入小程序时，关联 Tuya MiniApp 开发者平台 中对应的智能小程序，才能进行开发、调试、上传代码。

2. 编写代码

Tuya MiniApp Tools 会自动在项目路径下为您初始化项目模板，您可以使用代码编辑器打开该项目，进行编写。

了解小程序的目录结构与不同类型文件的作用：框架
了解小程序的基础组件：组件

3. 预览调试

在开发过程中，小程序的运行效果会在主界面左侧的模拟器中显示。

由于模拟器尚未支持全部 API，因此，您还需要使用真机调试来预览与调试小程序的实际运行情况。

4. 上传代码

在完成开发之后，点击 Tuya MiniApp Tools 中的上传按钮，本地代码将会上传至云端。

Tuya MiniApp 开发者平台中就会对应显示上传的版本。

五、体验测试

步骤 1：安装 App

测试人员首先需要找到客户端开发人员拿到需要测试的 App 安装包。客户端开发人员需要保证 App 已集成小程序能力，同时基础库版本、Kit 包版本兼容当前要扫码的小程序。

步骤 2：成为项目成员、加入白名单

要求开发者在小程序开发者平台 > 成员管理中添加测试人员账号。这样，测试人员就可以在自己的账号列表下找到小程序项目。

同时，还需要让开发者正确的配置 投放管理，并且在 白名单 中添加测试人员账号。

具体流程，请参考：小程序开发者平台 > 体验二维码。

步骤 3：生成体验二维码

在小程序开发者平台 > 版本管理中，将需要测试的版本设为体验版。
单击 体验二维码 按钮。
配置二维码信息，可以指定小程序自动进入某个页面。也可以什么都不配置，直接单击确定。
扫描体验二维码。

六、小程序合规

为促进小程序的安全合规，涂鸦对域名及请求路径提供安全校验。

在使用下表中所列 API 以及加载静态资源时，小程序开发者需要在开发者平台做相应配置，才可成功调用对应 API。否则，发起请求后，会出现页面加载问题及请求问题。

需合规 API	配置处
ty.request()	开发者平台-开发设置-多区服务器域名
ty.uploadFile()	开发者平台-开发设置-多区服务器域名
ty.downloadFile()	开发者平台-开发设置-多区服务器域名
静态资源	开发者平台-开发设置-多区静态资源

ty.request()、ty.uploadFile()、ty.downloadFile() 请求的域名需要添加到 小程序开发者平台 > 开发设置 > 多区服务器域名 中。

这些 API 需要根据投放的区域不同，为不同的区域配置不同的域名。注意：配置时，域名不要携带根路径 / 。

如需查看 App 投放的区域，请前往 小程序开发者平台 > 投放管理。

小程序代码包中指定的静态资源链接，同样也需要添加到 小程序开发者平台 > 开发设置 > 多区静态资源 中。在此处，您需要配置相应的静态资源域名，不同区域对应不同的域名。

注意：配置时，域名不要携带根路径 / 。

七、审核上线

登录 Tuya MiniApp 开发者平台，单击所需要上传的小程序名称，跳转至 版本管理 页。
在 开发版本 页签下，找到对应版本，单击 提交审核。
提交审核后，在 审核版本 页签中，您可看到提交版本的审核状态。
审核通过后，在 线上版本 页签中，您可看到待上线的版本。您可以单击 启用服务 按钮，使该版本小程序上线，或者单击 停用服务 按钮，使上线的小程序下线。

版本阶段	说明	可操作的按钮
开发版本	每次上传的代码都对应独立的开发版本。	提交审核、删除
体验版本	【可选】在正式上线之前，可以设置体验版本，让权限成员优先测试体验。	设为体验版
审核版本	开发版本的提审阶段。如果某版本审核不通过，需要根据驳回原因，将版本退回修改。	不同的审核状态对应不同的操作按钮： - 审核中：取消审核 - 审核通过：申请上线 - 不通过：取消审核
线上版本	面向全部用户的正式版本。	启用服务、停用服务