AMIS：百度开源的前端低代码神器，18.4k star 背后的开发效率提升利器

嗨，我是小华同学，专注解锁高效工作与前沿AI工具！每日精选开源技术、实战技巧，助你省时50%、领先他人一步。👉免费订阅，与10万+技术人共享升级秘籍！

AMIS（前端低代码框架）是百度开源的低代码前端框架，基于纯 JSON 配置即可生成完整后台页面，包括表单、表格、图表、CRUD 列表，支持可视化拖拽编辑。，星标数已达 18.4k，百度内部已沉淀超过 5 万个页面，广泛应用于审核系统、数据管理后台、模型监控等落地场景

• 零 JS 编码：针对非前端背景的开发者，也可快速构建交互页面；
• 高沉淀：内部生产环境已运行数年，积累了稳定、可扩展的能力；
• 组件丰富：内置表单、表格、图表、代码编辑器、富文本等超 120+ UI 组件。

用户痛点

传统后台开发常见瓶颈：

• 前端复杂度高，组件选型/样式难统一；
• 开发效率低，重复造 CRUD、表单验证轮子；
• 项目迭代缓慢，版本发布频繁但人力成本高；
• 部门之间协作门槛大：产品、后端、前端隔阂明显。

AMIS 用 JSON 驱动渲染，解放前端工程能力，让后端团队也能产出完整交互页面，从而实现更快交付、更强协同。

核心特色功能

✨ 1. JSON 驱动页面生成

无需 JS 语法，只要 JSON 配置：

{
  "type": "page",
  "title": "用户列表",
  "body": {
    "type": "crud",
    "api": "/api/users",
    "columns": [
      { "name": "id", "label": "ID" },
      { "name": "name", "label": "姓名" },
      { "type": "operation", "label": "操作", "buttons": [...]
      }
    ]
  }
}

AMIS 会自动渲染 CRUD 页面，支持分页搜索、按钮操作、表单校验等。

2. 可视化编辑器

提供「可视化拖拽 + JSON 预览」，非技术人员也能配置界面，无需手写 JSON 。

3. 丰富 UI 组件库

从常规表单控件到日志diff、文件上传、PDF预览、图表可视化等均有覆盖，提高开发效率。

4. 混合开发模式

支持“低代码 + 自定义组件”：可针对复杂场景，通过 React/Vue 组件接入 AMIS 环境，保持灵活可扩展。

5. 表达式 & 数据绑定

JSON 中支持 ${变量} 动态引用，上下文参数传递轻松实现联动与表达式逻辑 。

6. 多端 & 权限国际化

支持主题定制、角色权限控制、国际化翻译，适配企业级多端部署需求。

技术架构解析

架构流程图

技术优势

界面效果展示

以下是 AMIS 渲染后的 UI 示例截图，并附对应配置分析：

• CRUD 列表：自动生成表格 + 操作按钮
• 图表页面：支持 ECharts 渲染，配合 JSON 配置实现数据可视化
• 复杂表单：级联、多选、动态验证等常见需求一应俱全

应用场景

• 企业内部后台管理系统：用户管理、订单管理、权限分配等；
• 数据分析与监控平台：实时图表、日志展示、模型监控接口；
• 快速原型与业务验证：产品配置前端视图、测试交互流程；
• CRM/ERP 数据录入系统：表单导入导出、审核流配置等；
• 混合微前端系统：低代码配置 + 业务组件动态组合。

同类项目对比

项目地址

https://github.com/baidu/amis