gm-printer 10.27.4-beta.0 → 10.27.4-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +56 -77
- package/package.json +4 -6
- package/.github/workflows/release.yml +0 -49
- package/assets/image-20230509125111428.png +0 -0
- package/assets/image-20230509125629476.png +0 -0
- package/assets/image-20230509125812166.png +0 -0
- package/assets/image-20230509125922115.png +0 -0
- package/assets/image-20230509130332523.png +0 -0
package/README.md
CHANGED
|
@@ -1,22 +1,19 @@
|
|
|
1
|
-
# gm-printer
|
|
2
|
-
|
|
3
|
-
gm-printer
|
|
1
|
+
# gm-printer
|
|
2
|
+
|
|
3
|
+
gm-printer是一个实现开发者自定义网页打印的人类高质量开源库,你可以根据业务需要自定义打印字段配置(<a href='#template_config'>配置详情</a>),完成高质量网页打印功能。
|
|
4
|
+
|
|
4
5
|
|
|
5
6
|
## <div id='development'>开发指南</div>
|
|
6
|
-
|
|
7
7
|
以下操作将帮助你在本地机器上安装和运行该项目,进行开发
|
|
8
|
-
|
|
9
8
|
```bash
|
|
10
9
|
# 先安装依赖
|
|
11
10
|
yarn
|
|
12
11
|
# 项目启动
|
|
13
12
|
yarn start
|
|
14
13
|
# 项目构建(基本不怎么使用)
|
|
15
|
-
yarn build
|
|
14
|
+
yarn build
|
|
16
15
|
```
|
|
17
|
-
|
|
18
16
|
## <div id='usage'>安装使用指南</div>
|
|
19
|
-
|
|
20
17
|
```bash
|
|
21
18
|
# npm
|
|
22
19
|
npm i gm-printer
|
|
@@ -25,10 +22,9 @@ yarn add gm-printer
|
|
|
25
22
|
```
|
|
26
23
|
|
|
27
24
|
## <div id='simple_categroy'>配置目录简述</div>
|
|
28
|
-
|
|
29
25
|
```bash
|
|
30
26
|
├── src
|
|
31
|
-
│ ├── index.js
|
|
27
|
+
│ ├── index.js
|
|
32
28
|
│ ├── add_fields # 右侧对应的字段配置
|
|
33
29
|
│ ├── data_to_key # 原始数据转换成打印数据
|
|
34
30
|
│ ├── mock_data # 模拟数据
|
|
@@ -39,60 +35,55 @@ yarn add gm-printer
|
|
|
39
35
|
```
|
|
40
36
|
|
|
41
37
|
## 版本管理
|
|
38
|
+
所有的版本都有 3 个数字:x.y.z。
|
|
39
|
+
* 第一个数字是主版本。
|
|
40
|
+
* 第二个数字是次版本。
|
|
41
|
+
* 第三个数字是补丁版本。
|
|
42
42
|
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
- 第三个数字是补丁版本。
|
|
48
|
-
|
|
49
|
-
当发布新的版本时,不仅仅是随心所欲地增加数字,还要遵循以下规则:
|
|
50
|
-
|
|
51
|
-
- 当进行不兼容的 API 更改时,则升级主版本。
|
|
52
|
-
- 当以向后兼容的方式添加功能时,则升级次版本。
|
|
53
|
-
- 当进行向后兼容的缺陷修复时,则升级补丁版本。
|
|
43
|
+
当发布新的版本时,不仅仅是随心所欲地增加数字,还要遵循以下规则:
|
|
44
|
+
* 当进行不兼容的 API 更改时,则升级主版本。
|
|
45
|
+
* 当以向后兼容的方式添加功能时,则升级次版本。
|
|
46
|
+
* 当进行向后兼容的缺陷修复时,则升级补丁版本。
|
|
54
47
|
|
|
55
48
|
该约定在所有编程语言中均被采用,每个 npm 软件包都必须遵守该约定,这一点非常重要,因为整个系统都依赖于此。
|
|
56
49
|
|
|
57
|
-
## 版本发布
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-

|
|
64
|
-
|
|
65
|
-
2. 正式版本的发布
|
|
50
|
+
## 版本发布 [<font size=2.5>参考链接</font>](https://eminoda.github.io/2021/01/29/npm-semver-strategy/)
|
|
51
|
+
一般版本发布分为如下几个版:
|
|
52
|
+
* 内测版本(alpha)
|
|
53
|
+
* 公测版本(beta)
|
|
54
|
+
* 正式版本的候选版本(rc: release candiate)
|
|
55
|
+
* 正式版本
|
|
66
56
|
|
|
67
|
-
|
|
68
|
-
2. 切换到 master,之后执行 yarn release 选择正式版本(注意 minor 和 patch 的区别)
|
|
57
|
+
发布操作如下:
|
|
69
58
|
|
|
70
|
-
|
|
59
|
+
前情提要:
|
|
60
|
+
* 发布重大版本或版本改动较大时,先发布alpha、beta、rc等先行版本。
|
|
61
|
+
* 将`pageage.json`中的`version`修改为`X.X.X-beta.0`,或者运行 `npm version X.X.X-beta.0`来更新`package.json`,同时创建一个 git 标签[参考](https://docs.npmjs.com/cli/version)。
|
|
62
|
+
```bash
|
|
63
|
+
npm login # 输入用户名和密码
|
|
71
64
|
|
|
72
|
-
|
|
65
|
+
# 之后发布你要发布的测试版本
|
|
66
|
+
npm publish --tag (alpha | beta)
|
|
73
67
|
|
|
74
|
-
|
|
68
|
+
# 或发布正式版用
|
|
69
|
+
npm publish
|
|
70
|
+
```
|
|
75
71
|
|
|
76
|
-
自此自动发包完成!
|
|
77
72
|
上述操作在自己的分支上进行发布版本即可,发完后,将分支合并到 master 上!!!
|
|
78
73
|
|
|
79
74
|
## <div id='template_config'>模板文件(template_config)</div>
|
|
80
|
-
|
|
81
|
-
config 主要是有下面 6 大部分组成
|
|
82
|
-
|
|
75
|
+
config主要是有下面6大部分组成
|
|
83
76
|
```js
|
|
84
77
|
export default {
|
|
85
|
-
name: '模板名称',
|
|
86
|
-
page: {},
|
|
87
|
-
header: {},
|
|
88
|
-
contents: {},
|
|
89
|
-
sign: {},
|
|
90
|
-
footer: {}
|
|
78
|
+
'name': '模板名称', // 模板名称
|
|
79
|
+
'page': {}, // 模板整体的配置信息
|
|
80
|
+
'header': {}, // 页眉(每页都会渲染)
|
|
81
|
+
'contents': {}, // 主要内容(contents只渲染一次!第一页放不下,会顺延到次页继续渲染,直至全部渲染)
|
|
82
|
+
'sign': {}, // 签名(只在最后一页渲染)
|
|
83
|
+
'footer': {} // 页脚(每页都会渲染)
|
|
91
84
|
}
|
|
92
85
|
```
|
|
93
|
-
|
|
94
86
|
一个简单模板配置如下
|
|
95
|
-
|
|
96
87
|
```js
|
|
97
88
|
export default {
|
|
98
89
|
name: '模板名称',
|
|
@@ -104,22 +95,18 @@ export default {
|
|
|
104
95
|
height: '297mm' // 纸张高度
|
|
105
96
|
},
|
|
106
97
|
printDirection: 'vertical', // 打印布局方向(两种: vertical, horizontal)
|
|
107
|
-
gap: {
|
|
108
|
-
// 纸张内边距
|
|
98
|
+
gap: { // 纸张内边距
|
|
109
99
|
paddingRight: '5mm',
|
|
110
100
|
paddingLeft: '5mm',
|
|
111
101
|
paddingBottom: '5mm',
|
|
112
102
|
paddingTop: '5mm'
|
|
113
103
|
}
|
|
114
104
|
},
|
|
115
|
-
header: {
|
|
116
|
-
//
|
|
117
|
-
blocks: [
|
|
118
|
-
// blocks数组,里面元素
|
|
105
|
+
header: { // 页眉
|
|
106
|
+
blocks: [ // blocks数组,里面元素
|
|
119
107
|
{
|
|
120
108
|
text: '收货人: {{收货人}}', // 文本块
|
|
121
|
-
style: {
|
|
122
|
-
// 文本块样式
|
|
109
|
+
style: { // 文本块样式
|
|
123
110
|
right: '',
|
|
124
111
|
left: '450px',
|
|
125
112
|
position: 'absolute',
|
|
@@ -127,17 +114,15 @@ export default {
|
|
|
127
114
|
}
|
|
128
115
|
}
|
|
129
116
|
],
|
|
130
|
-
style: {
|
|
131
|
-
// header 的样式
|
|
117
|
+
style: { // header 的样式
|
|
132
118
|
height: '97px'
|
|
133
119
|
}
|
|
134
120
|
},
|
|
135
|
-
contents: [
|
|
136
|
-
// contents数组,元素是object.
|
|
121
|
+
contents: [ // contents数组,元素是object.
|
|
137
122
|
{
|
|
138
123
|
blocks: [
|
|
139
124
|
{
|
|
140
|
-
text: '收货人: {{收货人}}',
|
|
125
|
+
text: '收货人: {{收货人}}', // 模板字符串用{{}}表示
|
|
141
126
|
style: {
|
|
142
127
|
right: '',
|
|
143
128
|
left: '450px',
|
|
@@ -151,32 +136,27 @@ export default {
|
|
|
151
136
|
}
|
|
152
137
|
},
|
|
153
138
|
{
|
|
154
|
-
className: '',
|
|
155
|
-
type: 'table',
|
|
156
|
-
dataKey: 'orders_category',
|
|
157
|
-
subtotal: {
|
|
158
|
-
// 是否显示table每页合计
|
|
139
|
+
className: '',
|
|
140
|
+
type: 'table', // type 表明是table
|
|
141
|
+
dataKey: 'orders_category', // table的接受哪些数据. dataKey详细看下文
|
|
142
|
+
subtotal: { // 是否显示table每页合计
|
|
159
143
|
show: false
|
|
160
144
|
},
|
|
161
|
-
columns: [
|
|
162
|
-
// 表单列配置
|
|
145
|
+
columns: [ // 表单列配置
|
|
163
146
|
{
|
|
164
147
|
head: '序号',
|
|
165
|
-
headStyle: {
|
|
166
|
-
// 表头样式
|
|
148
|
+
headStyle: { // 表头样式
|
|
167
149
|
textAlign: 'center'
|
|
168
150
|
},
|
|
169
|
-
style: {
|
|
170
|
-
// 表格样式
|
|
151
|
+
style: { // 表格样式
|
|
171
152
|
textAlign: 'center'
|
|
172
153
|
},
|
|
173
|
-
text: '{{列.序号}}'
|
|
154
|
+
text: '{{列.序号}}' // 表格内容
|
|
174
155
|
}
|
|
175
156
|
]
|
|
176
157
|
}
|
|
177
158
|
],
|
|
178
|
-
sign: {
|
|
179
|
-
// 签名(只在最后一页打印)
|
|
159
|
+
sign: { // 签名(只在最后一页打印)
|
|
180
160
|
blocks: [
|
|
181
161
|
{
|
|
182
162
|
text: '签收人:',
|
|
@@ -191,8 +171,7 @@ export default {
|
|
|
191
171
|
height: '46px'
|
|
192
172
|
}
|
|
193
173
|
},
|
|
194
|
-
footer: {
|
|
195
|
-
// 页脚
|
|
174
|
+
footer: { // 页脚
|
|
196
175
|
blocks: [
|
|
197
176
|
{
|
|
198
177
|
text: '页码: {{当前页码}} / {{页码总数}}',
|
|
@@ -222,7 +201,6 @@ export default {
|
|
|
222
201
|
```
|
|
223
202
|
|
|
224
203
|
## data 数据
|
|
225
|
-
|
|
226
204
|
```json
|
|
227
205
|
{
|
|
228
206
|
common: object, // 非表格数据
|
|
@@ -250,3 +228,4 @@ contents.panel.0.block.0 //区域块的每一个块
|
|
|
250
228
|
contents.table.0 //区域表格
|
|
251
229
|
contents.table.0.column.0 // 区域表格的每一个表格
|
|
252
230
|
```
|
|
231
|
+
|
package/package.json
CHANGED
|
@@ -1,14 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "gm-printer",
|
|
3
|
-
"version": "10.27.4-beta.
|
|
3
|
+
"version": "10.27.4-beta.1",
|
|
4
4
|
"description": "diy printer",
|
|
5
5
|
"main": "src/index.js",
|
|
6
6
|
"scripts": {
|
|
7
7
|
"precommit": "lint-staged",
|
|
8
8
|
"start": "webpack-dev-server --hot",
|
|
9
9
|
"build": "webpack -p",
|
|
10
|
-
"locale": "i18n-m sync src/"
|
|
11
|
-
"release": "bumpp"
|
|
10
|
+
"locale": "i18n-m sync src/"
|
|
12
11
|
},
|
|
13
12
|
"lint-staged": {
|
|
14
13
|
"./src/**/*.js": [
|
|
@@ -108,10 +107,9 @@
|
|
|
108
107
|
"url-loader": "^1.1.1",
|
|
109
108
|
"webpack": "^4.17.2",
|
|
110
109
|
"webpack-cli": "^3.1.0",
|
|
111
|
-
"webpack-dev-server": "^3.1.7"
|
|
112
|
-
"bumpp": "8.2.0"
|
|
110
|
+
"webpack-dev-server": "^3.1.7"
|
|
113
111
|
},
|
|
114
112
|
"dependencies": {
|
|
115
113
|
"qrcode.react": "^0.9.2"
|
|
116
114
|
}
|
|
117
|
-
}
|
|
115
|
+
}
|
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
name: Release
|
|
2
|
-
|
|
3
|
-
permissions:
|
|
4
|
-
contents: write
|
|
5
|
-
|
|
6
|
-
on:
|
|
7
|
-
push:
|
|
8
|
-
tags:
|
|
9
|
-
- 'v*'
|
|
10
|
-
|
|
11
|
-
jobs:
|
|
12
|
-
release:
|
|
13
|
-
runs-on: ubuntu-latest
|
|
14
|
-
steps:
|
|
15
|
-
- uses: actions/checkout@v3
|
|
16
|
-
with:
|
|
17
|
-
fetch-depth: 0
|
|
18
|
-
|
|
19
|
-
- name: Set node
|
|
20
|
-
uses: actions/setup-node@v3
|
|
21
|
-
with:
|
|
22
|
-
node-version: 16.x
|
|
23
|
-
registry-url: 'https://registry.npmjs.org'
|
|
24
|
-
|
|
25
|
-
- name: ChangeLog
|
|
26
|
-
run: npx changelogithub
|
|
27
|
-
env:
|
|
28
|
-
GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}}
|
|
29
|
-
|
|
30
|
-
- name: Setup
|
|
31
|
-
run: npm i -g @antfu/ni
|
|
32
|
-
|
|
33
|
-
- name: Install
|
|
34
|
-
run: nci
|
|
35
|
-
|
|
36
|
-
- name: Build
|
|
37
|
-
run: npm run build
|
|
38
|
-
|
|
39
|
-
- name: Release
|
|
40
|
-
run: |
|
|
41
|
-
if [[ ${{ github.ref }} == *refs/tags/*-beta* ]]; then
|
|
42
|
-
npm publish --tag beta
|
|
43
|
-
elif [[ ${{ github.ref }} == *refs/tags/*-alpha* ]]; then
|
|
44
|
-
npm publish --tag alpha
|
|
45
|
-
else
|
|
46
|
-
npm publish
|
|
47
|
-
fi
|
|
48
|
-
env:
|
|
49
|
-
NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|