Form Js MCP

表单js-mcp

MCP服务器，允许AI助手使用创建和操作基于JSON的表单 @bpmn-io/form-js.

表单在内存中作为纯JSON模式进行管理，不需要DOM或浏览器依赖性。服务器提供用于创建表单、添加/删除/替换组件、设置验证和布局以及导出模式的工具。

设置

VS代码MCP配置

增添 .vscode/mcp.json:

{
  "servers": {
    "form": {
      "command": "npx",
      "args": ["form-js-mcp"]
    }
  }
}

使用文件持久性：

{
  "servers": {
    "form": {
      "command": "npx",
      "args": ["form-js-mcp", "--persist-dir", "./forms"]
    }
  }
}

本地开发

npm install
npm run build
npm start

AI代理说明

当与 .form 文件或表单架构：

1. 始终使用MCP工具 --不要手动编写JSON模式；使用提供的工具创建、修改和导出表单。
2. 从开始 create_form 得到一个 formId --通过a schema param导入现有的JSON模式，或 cloneFromId 克隆现有表单。
3. 添加组件 随着 add_form_component --键控类型自动生成唯一键。
4. 设置属性 随着 set_form_component_properties --在单个调用中支持验证、布局、条件和选项属性。
5. 检查 随着 inspect_form --使用以下方面 "validation", "summary", "variables", "components"，或 "schema" 检查表格。
6. 出口 随着 export_form_to_file({ filePath: "./myform.form" }) 将表单架构保存到文件中（自动添加.form扩展名）。

表单建模最佳实践

• 命名： 使用与流程变量名称匹配的描述性关键字（例如。 firstName, orderAmount).
• 验证： 始终设置 required: true 在必填字段上。使用 minLength/maxLength 对于文本， min/max 对于数字。
• 布局： 该表单使用16列网格。使用 set_form_component_properties 控制列宽和 modify_form_component({ action: "auto-layout" }) 用于自动布局。
• 条件： 使用 set_form_component_properties 随着 conditional 在 properties 根据FEEL表达式显示/隐藏字段。
• 组： 使用 group 用于组织相关字段的容器。使用 dynamiclist 用于可重复的部分。

可用工具

可用资源

可用提示

许可证

麻省理工学院