快速上手

如何使用?

通过包引用使用

官方表单物料可以直接通过包引用使用:

npm
yarn
pnpm
bun
npm install @flowgram.ai/form-materials
import { JsonSchemaEditor } from '@flowgram.ai/form-materials'

通过 CLI 添加物料源代码使用

如果业务对组件有定制诉求(如:更改文案、样式、业务逻辑),推荐 通过 CLI 将物料源代码添加到项目中进行定制

npx @flowgram.ai/cli@latest materials

运行后 CLI 会提示用户选择要添加到项目中的物料:

? Select one material to add: (Use arrow keys)
 components/json-schema-editor
  components/type-selector
  components/variable-selector

使用者也可以直接在 CLI 中添加指定物料的源代码:

npx @flowgram.ai/cli@latest materials components/json-schema-editor

CLI 运行成功后,相关物料会自动添加到当前项目下的 src/form-materials 目录下

注意事项
  1. 官方物料目前底层基于 Semi Design 实现,业务如果有底层组件库的诉求,可以通过 CLI 复制源码进行替换
  2. 一些物料会依赖一些第三方 npm 库,这些库会在 CLI 运行时自动安装
  3. 一些物料会依赖另外一些官方物料,这些被依赖的物料源代码在 CLI 运行时会一起被添加到项目中去