@xsyx/hanzo-element

hanzo-element

开发工具安装

npm install @xsyx/hanzo-cli -g

hanzo -v| --version       // 查看当前版本
      format|f            // 格式化组件导出文件，统一添加 install 全局方法
      init|i [name]       // 初始化组件，会自动执行 hanzo f,可指定组件名，默认为 button
      run [name]          // 运行组件，提供调试，可指定组件名，或运行所有组件
      install [options]   // 安装依赖，代理 npm 安装，保持组件项目纯净
      build|b             // 依据配置文件的配置来打包组件

新增依赖方式(重要注意点)

 hanzo install [options]   // 安装依赖，代理 npm 安装，保持组件项目纯净

介绍

基于element ui 二次开发

组件开发规范

• 组件命名:
  • 目录结构：组件名称/src/index.vue , index.vue 指定组件名称
  • 组件名称：中划线命名分割，前缀he
  • 演示文件：demo.vue
  • 唯一入口: index.js
• 如果包含父子组件，需要更改目录结构，参考he-table
• 组件内如果依赖了其他组件，需要在当前组件内引入，参考 element ui Select 组件

开发进度

• 可编辑表格
• preview-dialog 图片视频预览弹窗
• upload 单个/批量上传
• table-virtual 表格列表虚拟渲染(支持一次渲染上万数据)
• router-tab tab标签支持iframe
• dynamic-table 动态表格
• city-select 省市区联动
• dynamic-from 动态表单
• qq-map 地图
• import-dialog 导入弹窗
• export-dialog 导出弹窗
• table-control、table-filter、table-layout、table-pagination 页面布局：常规表格布局类型
• 文档地址

已完成开发

• iconfont 图标
• iframe
• page 基础页面

更新注意点