2026-03-16 17:58:57 +08:00
|
|
|
|
# r-utils
|
2023-04-20 09:26:40 +08:00
|
|
|
|
|
2026-03-16 17:58:57 +08:00
|
|
|
|
前端工具库 monorepo,使用 pnpm workspace 管理,Vite 构建。
|
2023-04-20 09:26:40 +08:00
|
|
|
|
|
2026-03-16 17:58:57 +08:00
|
|
|
|
## 包列表
|
2023-04-20 09:26:40 +08:00
|
|
|
|
|
2026-03-16 17:58:57 +08:00
|
|
|
|
| 包名 | 路径 | 描述 |
|
|
|
|
|
|
| ---- | ---- | ---- |
|
|
|
|
|
|
| `@r-utils/common` | `packages/common` | 通用 JS/TS 工具(权限、倒计时、打印、时间等) |
|
|
|
|
|
|
| `@r-utils/vue3` | `packages/vue3` | Vue3 工具(class 处理、dispatch 等) |
|
|
|
|
|
|
| `@r-utils/uni-app` | `packages/uni-app` | uni-app 工具(请求封装、蓝牙、NFC、打印等) |
|
|
|
|
|
|
| `@r-utils/vue2` | `packages/vue2` | Vue2 工具(visibility 插件) |
|
2023-04-20 09:26:40 +08:00
|
|
|
|
|
2026-03-16 17:58:57 +08:00
|
|
|
|
## 环境要求
|
2023-04-20 09:26:40 +08:00
|
|
|
|
|
2026-03-16 17:58:57 +08:00
|
|
|
|
- Node.js >= 18.12.0
|
|
|
|
|
|
- pnpm >= 8.15.6
|
2023-04-20 09:26:40 +08:00
|
|
|
|
|
2026-03-16 17:58:57 +08:00
|
|
|
|
## 安装依赖
|
2023-04-20 09:26:40 +08:00
|
|
|
|
|
2026-03-16 17:58:57 +08:00
|
|
|
|
```bash
|
|
|
|
|
|
pnpm install
|
|
|
|
|
|
```
|
2023-04-20 09:26:40 +08:00
|
|
|
|
|
2026-03-16 17:58:57 +08:00
|
|
|
|
## 构建
|
2023-04-20 09:26:40 +08:00
|
|
|
|
|
2026-03-16 17:58:57 +08:00
|
|
|
|
### 构建所有包
|
2023-04-20 09:26:40 +08:00
|
|
|
|
|
2026-03-16 17:58:57 +08:00
|
|
|
|
```bash
|
|
|
|
|
|
pnpm build
|
|
|
|
|
|
```
|
2023-04-20 09:26:40 +08:00
|
|
|
|
|
2026-03-16 17:58:57 +08:00
|
|
|
|
### 构建单个包
|
2023-04-20 09:26:40 +08:00
|
|
|
|
|
2026-03-16 17:58:57 +08:00
|
|
|
|
```bash
|
|
|
|
|
|
cd packages/common
|
|
|
|
|
|
pnpm build
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
每个包使用 **Vite lib 模式**构建,输出到 `dist/` 目录:
|
|
|
|
|
|
|
|
|
|
|
|
```text
|
|
|
|
|
|
dist/
|
|
|
|
|
|
├── index.mjs # ESM 格式
|
|
|
|
|
|
├── index.cjs # CJS 格式
|
|
|
|
|
|
├── index.d.ts # TypeScript 类型声明
|
|
|
|
|
|
├── index.mjs.map # Source Map
|
|
|
|
|
|
└── index.cjs.map
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
### 监听模式
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
cd packages/common
|
|
|
|
|
|
pnpm watch
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## 使用方式
|
|
|
|
|
|
|
|
|
|
|
|
### ESM 引入(推荐)
|
|
|
|
|
|
|
|
|
|
|
|
支持 tree-shaking,打包工具会自动按需引入用到的部分。
|
|
|
|
|
|
|
|
|
|
|
|
```ts
|
|
|
|
|
|
// 完整引入
|
|
|
|
|
|
import { Permission, Countdown, KnockTest } from '@r-utils/common';
|
|
|
|
|
|
|
|
|
|
|
|
// 按需引入(bundler 自动 tree-shaking,只打包 Permission)
|
|
|
|
|
|
import { Permission } from '@r-utils/common';
|
|
|
|
|
|
|
|
|
|
|
|
// Vue3 工具
|
|
|
|
|
|
import { mergeClass, dispatch } from '@r-utils/vue3';
|
|
|
|
|
|
|
|
|
|
|
|
// uni-app 工具
|
|
|
|
|
|
import { Request } from '@r-utils/uni-app';
|
|
|
|
|
|
|
|
|
|
|
|
// Vue2 插件
|
|
|
|
|
|
import { VisibilityPlugin } from '@r-utils/vue2';
|
|
|
|
|
|
Vue.use(VisibilityPlugin);
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
### CJS 引入
|
|
|
|
|
|
|
|
|
|
|
|
```js
|
|
|
|
|
|
const { Permission } = require('@r-utils/common');
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
### package.json exports
|
|
|
|
|
|
|
|
|
|
|
|
每个包均配置了标准的 `exports` 字段,打包工具会自动选择正确的格式:
|
|
|
|
|
|
|
|
|
|
|
|
```json
|
|
|
|
|
|
{
|
|
|
|
|
|
"exports": {
|
|
|
|
|
|
".": {
|
|
|
|
|
|
"types": "./dist/index.d.ts",
|
|
|
|
|
|
"import": "./dist/index.mjs",
|
|
|
|
|
|
"require": "./dist/index.cjs"
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## 开发
|
|
|
|
|
|
|
|
|
|
|
|
### 测试
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
# 运行所有测试
|
|
|
|
|
|
pnpm test
|
|
|
|
|
|
|
|
|
|
|
|
# 运行单个测试文件
|
|
|
|
|
|
npx jest packages/common/test/permission.test.ts
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
### 代码检查与格式化
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
pnpm lint
|
|
|
|
|
|
pnpm format
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
### Git 提交
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
# 使用 commitizen(遵循 conventional commits)
|
|
|
|
|
|
pnpm commit
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
提交时 husky 会自动运行 lint-staged 和 jest 测试。
|
|
|
|
|
|
|
2026-03-17 10:24:02 +08:00
|
|
|
|
## 发布
|
|
|
|
|
|
|
|
|
|
|
|
### 发布到私有 npm 仓库
|
|
|
|
|
|
|
|
|
|
|
|
项目已配置发布到私有 npm 仓库 `http://192.168.2.127:4873`。
|
|
|
|
|
|
|
|
|
|
|
|
#### Windows (PowerShell)
|
|
|
|
|
|
|
|
|
|
|
|
```powershell
|
|
|
|
|
|
# 发布所有子包
|
|
|
|
|
|
powershell scripts/publish.ps1
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
#### Linux/macOS (Bash)
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
# 发布所有子包
|
|
|
|
|
|
bash scripts/publish.sh
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
发布脚本会自动:
|
|
|
|
|
|
|
|
|
|
|
|
1. 构建所有子包
|
|
|
|
|
|
2. 依次发布 `@r-utils/common`、`@r-utils/vue3`、`@r-utils/uni-app`、`@r-utils/vue2`
|
|
|
|
|
|
|
|
|
|
|
|
### 安装已发布的包
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
# 配置 npm registry
|
|
|
|
|
|
npm config set registry http://192.168.2.127:4873
|
|
|
|
|
|
|
|
|
|
|
|
# 或在项目中使用 .npmrc 文件
|
|
|
|
|
|
echo "registry=http://192.168.2.127:4873" > .npmrc
|
|
|
|
|
|
|
|
|
|
|
|
# 安装包
|
|
|
|
|
|
pnpm add @r-utils/common
|
|
|
|
|
|
pnpm add @r-utils/vue3
|
|
|
|
|
|
pnpm add @r-utils/uni-app
|
|
|
|
|
|
pnpm add @r-utils/vue2
|
|
|
|
|
|
```
|
|
|
|
|
|
|
2026-03-16 17:58:57 +08:00
|
|
|
|
## 项目结构
|
|
|
|
|
|
|
|
|
|
|
|
```text
|
|
|
|
|
|
r-util-js/
|
|
|
|
|
|
├── packages/
|
|
|
|
|
|
│ ├── common/ # @r-utils/common
|
|
|
|
|
|
│ │ ├── src/
|
|
|
|
|
|
│ │ │ ├── permission/ # Permission 权限校验
|
|
|
|
|
|
│ │ │ ├── timer/ # Countdown、TimeoutTimer
|
|
|
|
|
|
│ │ │ ├── printer/ # ESC/TSC 打印指令
|
|
|
|
|
|
│ │ │ ├── knock-test/ # KnockTest 敲击触发
|
|
|
|
|
|
│ │ │ └── time/ # 时间工具
|
|
|
|
|
|
│ │ ├── vite.config.ts
|
|
|
|
|
|
│ │ └── tsconfig.json
|
|
|
|
|
|
│ ├── vue3/ # @r-utils/vue3
|
|
|
|
|
|
│ ├── uni-app/ # @r-utils/uni-app
|
|
|
|
|
|
│ └── vue2/ # @r-utils/vue2
|
|
|
|
|
|
├── eslint.config.js # ESLint v9 flat config
|
|
|
|
|
|
├── prettier.config.js
|
|
|
|
|
|
└── pnpm-workspace.yaml
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## 参与贡献
|
|
|
|
|
|
|
|
|
|
|
|
1. Fork 本仓库
|
|
|
|
|
|
2. 新建 `feat/xxx` 分支
|
|
|
|
|
|
3. 提交代码
|
|
|
|
|
|
4. 新建 Pull Request
|