zhpub

v0.0.5

Published

3 months ago

适合于react和vue和uniapp以及web端

0High
0Medium
0Low

zhengchaojun

ZPub

综合性JavaScript工具库，适用于React、Vue、UniApp及Web端开发，提供基础工具、数据库管理、服务调用、UI组件等功能。

特性

🛠️ 基础工具类: 数组、日期、字符串、对象等常用工具方法
🗄️ 数据库管理: 实体管理、字段管理、配置管理等
🌐 服务调用: HTTP请求、数据服务、登录服务等
🎨 UI组件: 属性表单、地图组件、3D地图等
📱 跨平台: 支持React、Vue、UniApp及Web端
🎯 TypeScript: 完整的类型定义支持

安装

npm install zhpub

快速开始

ES6 模块导入

import { ZPub } from 'zhpub'

// 使用基础工具类
const isEmpty = ZPub.CxArrayUtil.isEmpty([])
const formattedDate = ZPub.CxDateUtil.format(new Date(), 'YYYY-MM-DD')

// 使用服务调用
ZPub.Http.get('/api/data').then(response => {
  console.log(response)
})

CommonJS 导入

const { ZPub } = require('zhpub')

// 全局注册（适用于UniApp）
uni.cx = ZPub

Vue项目中使用

import { ZPub } from 'zhpub'

// 在Vue组件中使用
export default {
  mounted() {
    // 使用工具类
    const result = ZPub.CxStrUtil.trim('  hello world  ')
    
    // 使用数据服务
    ZPub.DataSvr.query('tableName', {}).then(data => {
      console.log(data)
    })
  }
}

系统要求

Node.js >= 16.0.0
建议使用 Node.js v20.0.7 以上版本

git commit提交说明

  git commit -m "type: 提交说明"
  如: git commit -m "fix: 修复bug2135中不能删除用户"

 type说明提交的性质，后面的英文冒号和“提交说明”间留一-个空格，type值如下:

 feat: 添加新特性
 fix: 修复bug
 docs: 仅仅修改了文档
 style: 仅仅修改了空格、格式缩进、逗号等等，不改变代码逻辑
 refactor: 代码重构，没有加新功能或者修复bug
 perf: 优化相关，比如提升性能、体验
 test: 增加测试用例
 chore: 改变构建流程、或者增加依赖库、工具等
 revert: 回滚到上一个版本

zbcx依赖

1、安装依赖

  npm install zbcx_cx

2、项目引用

  uni.cx = require('zbcx_cx').default                                // cx基础库引用
  window.comCx = require('zbcx_com_cx').default                         // com_cx基础库引用
  window.plugCx = require('zbcx_plug_cx').default                       // plug_cx基础库引用
或
  uni.cx = require('@/libs/cx/src/index').default                    // cx基础库引用
  window.comCx = require('@/coms/cx/src/coms/index').default            // com_cx基础库引用
  window.plugCx = require('@/plugins/cx/src/plugins/cx/index').default  // plug_cx基础库引用

  appVue.use(comCx)                                                     // 全量注册组件
  cx.run.usePlugLib([plugCx])                                           // 注册插件库

Cesium 扩展

1、安装依赖

npm i [email protected]
npm i cesium@latest

2、项目引用

import 'cesium/Build/Cesium/Widgets/widgets.css'                                // cesium样式引用
import * as Cesium from 'cesium'                                                // cesium引用
window.Cesium = Cesium															                            // 定义全局变量

import 'public/static/lib/cxe/cxe.css'                                          // cxe样式引用
uni.cxe = require('public/static/lib/cxe/cxe')                               // cxe基础库引用

第三方依赖

1、国际化vue-i18n

npm install vue-i18n

v9开始支持vue3
https://vue-i18n.intlify.dev/guide/

2、element-plus

npm install element-plus
npm install @element-plus/icons-vue

https://element-plus.gitee.io/zh-CN/guide/installation.html

3、安装右键菜单

npm install vue3-contextmenu

3、cx中依赖 axios

npm install axios

4、cx中依赖 crypto-js

npm install crypto-js

5、cx中依赖 xlsx

npm install xlsx

6、安装进度条

npm install nprogress

#注意事项 1:Framwork层只存放Util相关工具类和slot层和manager,constant，method通用层：适合于react和vue和uniapp以及web端，可以弃用uniapp

2:注意：不需要依赖第三方库

3:注意：即使是添加工具类也不需要依赖第三方库，含有第三方库封装的工具类在其他模块中添加

4:注意：添加类时需要包含头部注释，方法注释，参数注释，每个方法需要经过测试过才可添加

5：注意：zpub_base的添加适用A类型项目，B类型项目，C类型项目即不同类型的项目通用的类

6:注意：适用于react和vue和web端

7:删除 node_modules 安装 rimraf npm install rimraf -g // 使用命令删除 rimraf node_modules // 也可以删除其它文件夹或文件

8:考虑web，移动端，小程序，react

9:考虑和web端进行融合去使用，大量的工作用他们的东西就可以，节省我们app的人力

10：融合web上的三维上的东西

#使用方法 npm install zpub_bas

#上传方法 1:npm login

Username: zhengchaojun Password: Email: (this IS public) [email protected]

2:npm publish ：如果报错则换个名称

zpub_att #注意事项 1:属性通用层：只适合于vue和uniapp以及web端，可以弃用uniapp，考虑了react（不支持react） 2:属性层面，只放入通用属性相关适合于A，B，C类型的项目:用到了colorui相关的css东西:主工程需要加入clorui的依赖

zpub_controls #注意事项 1:只负责封装第三方的小控件，小组件这一类的东西：比如从第三方下载的树控件，picker控件 2:只负责封装 h5和移动端不适合web，react 通用形组件-适合A，B各种类型的项目- （考虑web，移动端，小程序，react） 3:zpub_controls和业务不挂钩，第三方的控件，只是某个控件 4:使用ly-tree组件的时候需要引入css：@import url("zpub_controls/components/tree/ly-tree.css");

zpub_db #注意事项 1:只存放系统级别(major=99)的bean对象：表对象，系统级别的主子类型,数据库相关通用配置信息存放,管理类相关也放置此处,适用于A，B，C类型的项目，如果不适用则可不放此处

zpub_ap_bas #注意事项 1:Framwork层只存放Util相关工具类和slot层和manager,constant，method通用层：适合于vue和uniapp以及web端，可以弃用uniapp，考虑了react

zpub_uni #注意事项 1:只负责封装uni相关的API

zpub_uni #注意事项 1:只负责封装 h5和移动端不适合web，react 通用形组件-适合A，B各种类型的项目- （考虑web，移动端，小程序，react） 2:和业务挂钩，自己封装的：可以将ismcard控件搞到次widget中，举例：附件，等等适合A，B各种类型的项目

1、属性缺少附件 2、附件初始化有问题

1、引入图片不太行 2、打包之后把其他页面放到其他文件夹中，通过router方式跳转报错 3、小程序打包成apk 4、模版的页面点击事件，添加feature

1、(/lg-input) (/lg-input/component) (Brochure.vue) lg-input.vue

打包成apk，app日志保存到本地全局点击事件普获