跳到主要内容

创建第一个组件库

准备工作#

  1. 拥有腾讯云账号;
  2. 开通云开发低码;
  3. 安装 Node.js
  4. 安装 Cloudbase CLI
注意

如果 npm install -g @cloudbase/cli 失败,您可能需要按照这个文档将npm安装在非系统管理员目录或修改默认npm目录

第 1 步:创建云端组件库#

打开 组件库管理 页面,新建组件库 mydemo

第 2 步:关联本地组件库#

tcb lowcode create mydemo
提示

创建本地组件库使用的标识 mydemo 需要和云端一致,才能关联上云端组件库。

或者使用命令 tcb lowcode create,通过智能提示来完成关联。

第 3 步:调试本地组件库#

cd mydemotcb lowcode debug

执行完以上命令后,会自动打开 调试模式 的应用编辑器,并加载了本地组件库。

可以在该页面进行调试:

  • 拖拽组件到 编辑区 内,并查看 预览区 效果
  • 在组件的 数据 栏,配置数据,并查看 预览区 效果
  • 在组件的 样式 栏,配置样式,并查看 预览区 效果
  • 在组件的 事件 栏,绑定自定义事件和自定义动作,并在 预览区 触发事件

第 4 步:发布本地组件库#

tcb lowcode publish
提示

发布本地组件库,相当于更新了云端组件库的草稿,还需要到控制台里把草稿发布成正式版本。

第 5 步:发布云端组件库#

打开 mydemo 组件库的组件详情页,发布组件库。

第 6 步: 在应用中使用自定义组件库#

使用方法和 第 3 步:调试本地组件库 相似,但这是 普通模式 的应用编辑器,编辑完应用可以正常发布。