初始化工程
前提条件
- 已了解 面板小程序是什么。
- 已了解面板小程序相关的 名词概念。
- 已了解 如何用 Ray 来开发微信小程序。
- 已准备完毕所需要的 开发环境。
- 已理解 产品、面板、设备的关系 并已拥有对应的产品。
操作步骤
您需要拥有涂鸦开发者账号,然后创建微信 SDK 小程序。如果尚未拥有涂鸦账户,请前往 注册涂鸦开发者账号。
创建微信 SDK 小程序
- 登录 涂鸦 IoT 平台,从左侧菜单进入 App / 微信小程序 SDK 页面。
- 在微信小程序 SDK 页面,单击 创建微信小程序 按钮。
- 填写项目名称、图标、描述等相关信息,单击 确定。
绑定微信小程序
- 点击创建好的小程序,进入小程序配置页面
- 点击去授权按钮,弹出授权选项,如还没有微信小程序的,可以选择 快速注册微信小程序 或 复用公众号资质创建小程序;
- 若要注册微信小程序的,请根据提示进行操作;
- 若已有微信小程序,则点击立即绑定,然后在弹出的授权页面中,使用微信小程序的管理员的微信进行扫描授权;
- 扫码授权后,等待授权结果,完成授权;
配置小程序密钥
- 进入微信小程序官方后台;
- 小程序管理员使用微信扫描登录小程序,进入小程序后台;
- 点击左侧菜单开发管理,然后再选择开发设置
- 在 AppSecret 选项中选择重置,管理员扫码验证身份后,复制获取 App Secret;
- 登录 涂鸦 IoT 平台,从左侧菜单依次点击 App -> 微信小程序 SDK -> 项目开发
- 选择切换到指定的小程序项目,然后将复制获取到的 App Secret 输入到文件框中,点击保存,即完成小程序密钥的配置。
初始化项目工程
如果已经开发了面板小程序,请忽略此步骤
首先,您需要使用 npm 或者 yarn 全局安装 @ray-js/create-app 命令
使用 npm 安装命令
npm install -g @ray-js/create-app
使用 yarn 安装
yarn global add @ray-js/create-app
使用 create-app 命令创建:
create-app my-app 或使用 yarn 命令创建:
yarn create @ray-js/app my-app
或使用 npm 命令创建:
npm init @ray-js/app my-app
或使用 npx 命令创建:
npx @ray-js/create-app my-app
其中 my-app 表示即将创建的项目名。
创建流程中使用键盘上下方向键选择相应模板并确认
? What project template would you like to generate? App 通用的 Ray 应用 App 面板开发 Ray 应用(redux) App 面板开发 Ray 应用(jotai)❯ 微信小程序开发 Ray 应用? What project template would you like to generate? 微信小程序开发 Ray 应用? Project name: my-appGenerating project...To run your app: cd my-app npm install npm run start:wechatDone.
出现 Done 字样表示创建完成。
接下来请使用编辑器打开项目地址,请进行开发。
想了解模板包含的功能,可点击这里