1.从左侧选择你想要的form组件可以拖拽到中间画布区域
2.右边设置区域可以设置表单属性和当前选中的表单组件属性
3.左边区域可以切换查看当前Tree和模板组件
4.导航区功能包括 全屏、切换黑暗模式、撤销、重做、保存到本地、重置页面、出码、生产json；
5.出码功能不同于常规表单拖拽导出的json然后使用规定的组件，而是导出原子组件代码类似el-input这种
6.扩展：想要扩展左边的组件，可直接在package文件夹下按照规定格式添加文件，vite会自动导入该组件，无需其他配置。

├── public                           ---静态资源文件
├── src          
│  ├── assets                        ---图片和字体
│  ├── components                    ---可复用的vue组件
│  ├── constant                    
│  ├── enums                       
│  ├── hooks
│  ├── icons
│  ├── packages
│  ├── plugins                          
│  ├── router                        ---路由
│  ├── store                        
│  ├── styles                        ---sass样式
│  ├── utils                         ---方法函数
│  ├── views                         ---页面
│  ├── App.vue                       
│  ├── main.ts                       
├── types                            
├── .cz-config.cjs
├── .eslintrc.cjs
├── .prettierrc.cjs
├──  package.json
├──  package-lock.json
├──  README.md
├──  commitlint.config.cjs
├──  index.html
├──  tsconfig.json
├──  tsconfig.node.json
└──  vite.config.ts                   

# 克隆项目
git clone https://github.com/biubiubiu01/vue3-form-drag.git
# 进入项目目录
cd vue3-form-drag
# 安装依赖
pnpm i
# 本地开发 启动项目
pnpm start

# 添加到git
git add 文件
# 提交commit并自动格式化,提交格式规范已设定好，选择即可
npm run commit
# 推送
git push

# 打包项目
npm run build