@sqbiz/wplugin-form-generator v1.0.0-biz-minions

简介

Element UI表单设计及代码生成器，可将生成的代码直接运行在基于Element的vue项目中；也可导出JSON表单，使用配套的解析器将JSON解析成真实的表单

• 预览地址
• 配套vscode插件
• 项目模块
  • 主模块: src/view/index
  • 渲染器: src/components/render
  • 配套JSON解析器: src/components/parser
  • tinymce编辑器(CND加载): src/components/tinymce
  • 预览模块: src/view/preview

运行

• 确保已经安装node.js 10+

# 安装项目依赖
npm install

# 本地开发
npm run dev

# 构建案例(可直接部署到web服务器中)
build:example

# 构建主模块库和预览模块库
npm run lib-all

# 构建扩展库并发布到npm
# 第一构建按照 lerna 多包管理工具
npm install lerna -g
# 如果使用了 nrm 管理镜像
nrm use npm
# 发布
lerna publish
nrm use taobao

文档

• el-dialog的封装与调用
• 项目主要结构分析
• 【常见问题】如何以npm的方式集成monaco编辑器
• 系列教程： 《表单设计器 · 开发教程》 《表单解析器 · 开发教程》 《vue代码生成器 · 开发教程》 《vue代码预览器 · 开发教程》
• JSON表单参数对照表

JSON解析器

将保存在数据库中的JSON表单，解析成真实的表单
查看在线示例

// 安装
npm i form-gen-parser

更多信息

vscode插件

帮助使用element UI的开发者完成基本的表单代码搭建任务，减少重复的劳动。
vscode-plugin分支配套插件为：form-generator-plugin；
使用插件可右键打开设计器，直接将代码保存到工程中。
安装插件请在vscode中搜索：Form Generator Plugin

PR鸣谢

• Mr_HJ/form-generator
• IWANABETHATGUY

开源协议

MIT