201 lines
5.5 KiB
Markdown
201 lines
5.5 KiB
Markdown
---
|
||
hero:
|
||
title: lambo
|
||
description: 致力于提升前端开发效率与规范（开发前请先阅读开发流程）
|
||
actions:
|
||
- text: 快速上手
|
||
link: /bizs
|
||
# features:
|
||
# - title: biz
|
||
# emoji: 🍑
|
||
# description: 业务库
|
||
# - title: hooks
|
||
# emoji: 💎
|
||
# description: hooks
|
||
# - title: func
|
||
# emoji: 🌈
|
||
# description: 常用函数库
|
||
# - title: meta
|
||
# emoji: ☀️
|
||
# description: 原子组件库
|
||
# - title: constants
|
||
# emoji: 🈶️
|
||
# description: 静态定义库
|
||
# - title: request
|
||
# emoji: 🥣
|
||
# description: 网络请求库
|
||
# - title: types
|
||
# emoji: 🈸
|
||
# description: typescript 声明库
|
||
# - title: material
|
||
# emoji: 🥱
|
||
# description: 物料库
|
||
# - title: cli
|
||
# emoji: 🐔
|
||
# description: 脚手架
|
||
---
|
||
|
||
## 开发流程
|
||
|
||
### 1. 确定需求
|
||
|
||
从 gitlab 上的 [issue](http://10.0.0.88/web-project/zhst-lambo/boards) 模块找到对应的需求。将 Assignee 负责人指派为自己（如果多人协同开发可以将需求拆分为多个需求，分别指派），然后将 Labels 标签改为 doing 状态。（截止日期选填）
|
||
|
||
> issuse 命名规则：@zhst/{包名} - {模块名}，然后在详情页描述对应需求。
|
||
|
||
### 2. 创建 git 分支
|
||
|
||
按照 git flow 规范从 [master](http://10.0.0.88/web-project/zhst-lambo) 上创建分支, 分支的命名规则参考：
|
||
|
||
1. feat/XXX: 需求新增
|
||
2. hotfix/XXX: bug 修复
|
||
|
||
### 3. 开始开发
|
||
|
||
进入项目文件夹，在 packages 下找到对应的 npm 包, 然后在 src 目录下按已有的格式进行开发，如果是功能变更就找到对应的页面进行修改
|
||
|
||
### 4. 提交代码，并提交 mr 到 develop 分支
|
||
|
||
完成开发后，给代码提交 commit，格式参考 ${行为}(${影响范围}): ${变更内容}， 例如：
|
||
|
||
> feat(package.json): 修改版本号
|
||
> fix(app.ts): 修改环境变量
|
||
|
||
对应的变更会在最终的 npm 包版本号体现：a.b.c - a 对应重构（一般用不上） - b 对应 feat（功能新增） - c 对应 hotfix（一般是 bug 修复）
|
||
|
||
push 完代码之后，在 gitlab 上提交一个 mr 到 develop 分支，指定给对应的人员审核（@江志雄），合并成功之后，将 [issue](http://10.0.0.88/web-project/zhst-lambo/boards) 对应的 Labels 状态改为 waittingPublish。
|
||
|
||
### 5. 发布成功
|
||
|
||
发布成功之后，会有两个行为：
|
||
|
||
1. 在钉钉群通知发布成功。
|
||
2. 生成线上预览[说明文档](http://10.0.0.204:30080)
|
||
|
||
一旦触发了钉钉通知，则需要去到 [issue](http://10.0.0.88/web-project/zhst-lambo/boards) 板块将对应的需求 **close** 掉。
|
||
|
||
这就是 npm 包整个开发链路。
|
||
|
||
## 目录结构
|
||
|
||
<Tree>
|
||
<ul>
|
||
<li>
|
||
docs
|
||
<small>全局文档</small>
|
||
<ul>
|
||
<li>
|
||
index.md
|
||
<small>这是首页文档</small>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
packages
|
||
<small>组件包目录</small>
|
||
<ul>
|
||
<li>
|
||
biz
|
||
<small>业务组件</small>
|
||
</li>
|
||
<li>
|
||
func
|
||
<small>函数库</small>
|
||
</li>
|
||
<li>
|
||
hooks
|
||
<small>hooks</small>
|
||
</li>
|
||
<li>
|
||
constants
|
||
<small>静态枚举值定义</small>
|
||
</li>
|
||
<li>
|
||
meta
|
||
<small>元组件</small>
|
||
</li>
|
||
<li>
|
||
request
|
||
<small>请求库</small>
|
||
</li>
|
||
<li>
|
||
types
|
||
<small>类型定义库</small>
|
||
</li>
|
||
<li>
|
||
material
|
||
<small>物料库</small>
|
||
</li>
|
||
<li>
|
||
cli
|
||
<small>脚手架</small>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
src
|
||
<small>这是 src 文件夹</small>
|
||
<ul>
|
||
<li>
|
||
index.md
|
||
<small>这是 index.md</small>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
.dumirc.ts
|
||
<small>文档配置</small>
|
||
</li>
|
||
<li>
|
||
package.json
|
||
<small>这是 package.json</small>
|
||
</li>
|
||
</ul>
|
||
</Tree>
|
||
|
||
## 本文档食用说明
|
||
|
||
目前在进行中的项目为：@zhst/bizs、@zhst/hooks、@zhst/meta、@zhst/func..
|
||
|
||
bizs: 基于@zhst/hooks、@zhst/meta、@zhst/func 开发，基本贴近于业务。<Badge>doing</Badge>
|
||
|
||
meta：基于 antd 开发，作为公司的定制化原子组件。<Badge>doing</Badge>
|
||
|
||
hooks：基于 ahooks、@zhst/func 定制化二次开发。<Badge>doing</Badge>
|
||
|
||
func：基于 lodash-es 定制化二次开发 (由于 utils 包名被使用了)<Badge>doing</Badge>
|
||
|
||
## 后续构思
|
||
|
||
想做一个，基于智慧视通开发场景和业务场景的前端技术流程化方案，希望它能渗透到整个研发的所有流程中。
|
||
|
||
比如：代码规范、git 提交规范、物料库、基于 electron 的前端工具客户端（可集成物料库、图片上传小工具）、api 自动生成...
|
||
|
||
:::info{title=@zhst/lint}
|
||
lint 工具库，包含：eslint-config、eslint-plugin、commit-lint
|
||
:::
|
||
|
||
:::info{title=@zhst/metarial}
|
||
物料库，可以直接通过 clone npm 仓库的形式生成模板页面，页面没有任何依赖，一个页面就是一个项目。
|
||
:::
|
||
|
||
:::info{title=@zhst/app}
|
||
基于 electron 的前端客户端工具，初期功能构思方案有：文件上传、git 仓库管理、物料库可视化页面一键生成
|
||
:::
|
||
|
||
:::info{title=@zhst/autoapi}
|
||
接口一键生成工具
|
||
:::
|
||
|
||
:::info{title=@types/zhst}
|
||
类型定义库
|
||
:::
|
||
|
||
:::info{title=@zhst/constants}
|
||
静态变量枚举库
|
||
:::
|
||
|
||
:::info{title=@zhst/cli}
|
||
基于物料库的脚手架，可以直接通过可视化界面搭建项目，偏向于 lowcode+ 思维
|
||
:::
|