Appearance
utils
路径:packages/shared/utils
包名:@xichen-full-stack/utils
纯 TypeScript 工具函数,不依赖 Vue / axios,web、desktop、mobile 均可引用。
模块一览
| 模块 | 方法 | 典型场景 |
|---|---|---|
| guard | isNil, isNonNullable, isEmpty | 表单、列表判空 |
| string | capitalize, truncate, trimToEmpty, camelToKebab | 展示文案、CSS 类名 |
| date | formatDate, formatDateTime, parseDate | 表格日期、日志 |
| object | pick, omit, deepClone | 提交前剔除字段、拷贝表单 |
| array | unique, uniqueBy, groupBy | 下拉去重、分组 |
| fn | sleep, debounce, throttle | 搜索框防抖、按钮节流 |
| url | joinUrl, buildQueryString, buildUrl | API 路径、分页 query |
| number | clamp, formatFileSize, formatNumber | 进度条、文件大小、金额 |
| error | getErrorMessage | catch 块统一提示 |
示例
typescript
import {
debounce,
formatDateTime,
getErrorMessage,
joinUrl,
isEmpty,
} from '@xichen-full-stack/utils'
const url = joinUrl('http://localhost:8080', '/api/v1/auth/login')
const onSearch = debounce((keyword: string) => {
if (isEmpty(keyword)) return
// ...
}, 300)
try {
await doSomething()
} catch (error) {
ElMessage.error(getErrorMessage(error, '请求失败'))
}mobile 的 src/api/http.ts 已使用 joinUrl。
构建
bash
pnpm --filter @xichen-full-stack/utils buildTurbo 全仓 pnpm build 时会因 ^build 依赖自动先构建 utils。
边界
- 权限、菜单、路由:使用
@xichen-full-stack/auth - HTTP、Token:使用
@xichen-full-stack/api-client - API 类型:使用
@xichen-full-stack/types