ares-styled-logger 1.2.0
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/CHANGELOG.md +7 -0
- package/README.md +208 -0
- package/assets/images/demo.png +0 -0
- package/dist/index.cjs +7 -0
- package/dist/index.d.cts +67 -0
- package/dist/index.d.mts +67 -0
- package/dist/index.d.ts +67 -0
- package/dist/index.mjs +7 -0
- package/dist/types/index.d.ts +15 -0
- package/package.json +17 -0
package/CHANGELOG.md
ADDED
package/README.md
ADDED
|
@@ -0,0 +1,208 @@
|
|
|
1
|
+
# 带样式的console
|
|
2
|
+
|
|
3
|
+
一个带有样式化的控制台日志工具,提供美观的日志输出格式,包括时间戳、图标和自定义样式。
|
|
4
|
+
|
|
5
|
+

|
|
6
|
+
|
|
7
|
+
## 特性
|
|
8
|
+
|
|
9
|
+
- 🎨 **样式化输出** - 为不同类型的日志提供独特的颜色和图标
|
|
10
|
+
- ⏰ **时间戳** - 自动显示日志记录的准确时间
|
|
11
|
+
- 🔍 **调用位置追踪** - 显示实际调用日志的位置
|
|
12
|
+
- 🔄 **覆盖/恢复原始控制台** - 可以覆盖原生 `console` 方法并在需要时恢复
|
|
13
|
+
- 🛠️ **可定制样式** - 支持自定义各种日志类型的样式
|
|
14
|
+
- 💡 **提示文本** - 支持在日志中添加特殊标记的提示文本(以 `##` 开头)
|
|
15
|
+
|
|
16
|
+
## 安装
|
|
17
|
+
|
|
18
|
+
```bash
|
|
19
|
+
npm install ares-styled-logger
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## 使用方法
|
|
23
|
+
|
|
24
|
+
### 基本使用
|
|
25
|
+
|
|
26
|
+
```typescript
|
|
27
|
+
import { StyledLogger } from 'ares-styled-logger';
|
|
28
|
+
|
|
29
|
+
// 创建实例并使用(所有方法都是实例方法)
|
|
30
|
+
const logger = new StyledLogger();
|
|
31
|
+
logger.log('这是一个普通日志');
|
|
32
|
+
logger.success('这是一个成功日志');
|
|
33
|
+
logger.warn('这是一个警告日志');
|
|
34
|
+
logger.error('这是一个错误日志');
|
|
35
|
+
logger.info('这是一个信息日志');
|
|
36
|
+
logger.debug('这是一个调试日志');
|
|
37
|
+
|
|
38
|
+
// 使用提示文本(以 ## 开头的字符串会被特殊处理)
|
|
39
|
+
logger.success('##操作完成', '其他参数...');
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
### 覆盖原生控制台
|
|
43
|
+
|
|
44
|
+
```typescript
|
|
45
|
+
import { StyledLogger } from 'ares-styled-logger';
|
|
46
|
+
|
|
47
|
+
// 创建实例并覆盖原生控制台方法
|
|
48
|
+
const logger = new StyledLogger();
|
|
49
|
+
logger.overrideOriginalLogger();
|
|
50
|
+
|
|
51
|
+
// 现在可以使用原生 console 方法,但会以样式化的方式输出
|
|
52
|
+
console.log('普通日志');
|
|
53
|
+
console.success('成功日志');
|
|
54
|
+
console.warn('警告日志');
|
|
55
|
+
console.error('错误日志');
|
|
56
|
+
console.info('信息日志');
|
|
57
|
+
console.debug('调试日志');
|
|
58
|
+
|
|
59
|
+
// 恢复原生控制台方法
|
|
60
|
+
logger.restoreOriginalLogger();
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
### 自定义样式配置
|
|
64
|
+
|
|
65
|
+
```typescript
|
|
66
|
+
import { StyledLogger } from 'ares-styled-logger';
|
|
67
|
+
|
|
68
|
+
// 样式配置示例
|
|
69
|
+
const styleConfigDemo = {
|
|
70
|
+
log: {
|
|
71
|
+
prefixStyle: 'background: #409EFF; color: white; border-radius: 5px; padding: 0 5px; line-height: 30px; height: 30px; font-size: 16px;',
|
|
72
|
+
prefixText: 'LOG',
|
|
73
|
+
icon: '😁',
|
|
74
|
+
iconStyle: 'line-height: 30px; height: 30px; font-size: 16px;',
|
|
75
|
+
tipStyle: 'color: #409EFF; border-color: #409EFF; border: 2px dashed; margin-left: 5px; border-radius: 5px; padding: 0 5px; line-height: 26px; height: 26px; font-size: 16px; font-weight: bold;',
|
|
76
|
+
realInvokeLocationStyle: 'padding: 5px 0; font-size: 14px;'
|
|
77
|
+
},
|
|
78
|
+
success: {
|
|
79
|
+
prefixStyle: 'background: #67C23A; color: white; border-radius: 5px; padding: 0 5px; line-height: 30px; height: 30px; font-size: 16px;',
|
|
80
|
+
prefixText: 'SUCCESS',
|
|
81
|
+
icon: '🥰',
|
|
82
|
+
iconStyle: 'line-height: 30px; height: 30px; font-size: 16px;',
|
|
83
|
+
tipStyle: 'color: #67C23A; border-color: #67C23A; border: 2px dashed; margin-left: 5px; border-radius: 5px; padding: 0 5px; line-height: 26px; height: 26px; font-size: 16px; font-weight: bold;',
|
|
84
|
+
realInvokeLocationStyle: 'padding: 5px 0; font-size: 14px;'
|
|
85
|
+
},
|
|
86
|
+
warn: {
|
|
87
|
+
prefixStyle: 'background: #E6A23C; color: white; border-radius: 5px; padding: 0 5px; line-height: 30px; height: 30px; font-size: 16px;',
|
|
88
|
+
prefixText: 'WARN',
|
|
89
|
+
icon: '🤪',
|
|
90
|
+
iconStyle: 'line-height: 30px; height: 30px; font-size: 16px;',
|
|
91
|
+
tipStyle: 'color: #E6A23C; border-color: #E6A23C; border: 2px dashed; margin-left: 5px; border-radius: 5px; padding: 0 5px; line-height: 26px; height: 26px; font-size: 16px; font-weight: bold;',
|
|
92
|
+
realInvokeLocationStyle: 'padding: 5px 0; font-size: 14px;'
|
|
93
|
+
},
|
|
94
|
+
error: {
|
|
95
|
+
prefixStyle: 'background: #F56C6C; color: white; border-radius: 5px; padding: 0 5px; line-height: 30px; height: 30px; font-size: 16px;',
|
|
96
|
+
prefixText: 'ERROR',
|
|
97
|
+
icon: '🥵',
|
|
98
|
+
iconStyle: 'line-height: 30px; height: 30px; font-size: 16px;',
|
|
99
|
+
tipStyle: 'color: #F56C6C; border-color: #F56C6C; border: 2px dashed; margin-left: 5px; border-radius: 5px; padding: 0 5px; line-height: 26px; height: 26px; font-size: 16px; font-weight: bold;',
|
|
100
|
+
realInvokeLocationStyle: 'padding: 5px 0; font-size: 14px;'
|
|
101
|
+
},
|
|
102
|
+
info: {
|
|
103
|
+
prefixStyle: 'background: #909399; color: white; border-radius: 5px; padding: 0 5px; line-height: 30px; height: 30px; font-size: 16px;',
|
|
104
|
+
prefixText: 'INFO',
|
|
105
|
+
icon: '🫣',
|
|
106
|
+
iconStyle: 'line-height: 30px; height: 30px; font-size: 16px;',
|
|
107
|
+
tipStyle: 'color: #909399; border-color: #909399; border: 2px dashed; margin-left: 5px; border-radius: 5px; padding: 0 5px; line-height: 26px; height: 26px; font-size: 16px; font-weight: bold;',
|
|
108
|
+
realInvokeLocationStyle: 'padding: 5px 0; font-size: 14px;'
|
|
109
|
+
},
|
|
110
|
+
debug: {
|
|
111
|
+
prefixStyle: 'background: #EE82EE; color: white; border-radius: 5px; padding: 0 5px; line-height: 30px; height: 30px; font-size: 16px;',
|
|
112
|
+
prefixText: 'DEBUG',
|
|
113
|
+
icon: '🧐',
|
|
114
|
+
iconStyle: 'line-height: 30px; height: 30px; font-size: 16px;',
|
|
115
|
+
tipStyle: 'color: #EE82EE; border-color: #EE82EE; border: 2px dashed; margin-left: 5px; border-radius: 5px; padding: 0 5px; line-height: 26px; height: 26px; font-size: 16px; font-weight: bold;',
|
|
116
|
+
realInvokeLocationStyle: 'padding: 5px 0; font-size: 14px;'
|
|
117
|
+
}
|
|
118
|
+
};
|
|
119
|
+
|
|
120
|
+
// 自定义样式配置(只修改部分属性)
|
|
121
|
+
const customStyleConfig = {
|
|
122
|
+
log: {
|
|
123
|
+
icon: '📝', // 修改普通日志的图标
|
|
124
|
+
prefixText: 'INFO', // 修改前缀文字
|
|
125
|
+
},
|
|
126
|
+
error: {
|
|
127
|
+
icon: '❌', // 修改错误类型的图标
|
|
128
|
+
prefixStyle: 'background: red; color: white; border-radius: 5px; padding: 0 5px; line-height: 30px; height: 30px; font-size: 16px;',
|
|
129
|
+
}
|
|
130
|
+
};
|
|
131
|
+
|
|
132
|
+
// 应用自定义配置
|
|
133
|
+
const logger = new StyledLogger(customStyleConfig);
|
|
134
|
+
```
|
|
135
|
+
|
|
136
|
+
### 深度合并配置
|
|
137
|
+
|
|
138
|
+
当应用自定义样式配置时,系统会使用深度合并算法来融合默认配置和自定义配置,这意味着你只需要提供需要更改的部分即可,不需要覆盖整个配置对象。
|
|
139
|
+
|
|
140
|
+
```javascript
|
|
141
|
+
// 仅更改部分属性,其余保持默认值
|
|
142
|
+
const partialConfig = {
|
|
143
|
+
error: {
|
|
144
|
+
icon: '❌', // 仅更改错误类型的图标
|
|
145
|
+
// 其他属性如 prefixStyle、prefixText 等仍使用默认值
|
|
146
|
+
}
|
|
147
|
+
};
|
|
148
|
+
|
|
149
|
+
const logger = new StyledLogger(partialConfig);
|
|
150
|
+
```
|
|
151
|
+
|
|
152
|
+
## 日志类型
|
|
153
|
+
|
|
154
|
+
| 类型 | 图标 | 颜色 | 用途 |
|
|
155
|
+
|------|------|------|------|
|
|
156
|
+
| log | 😁 | 蓝色 | 普通日志信息 |
|
|
157
|
+
| success | 🥰 | 绿色 | 成功状态 |
|
|
158
|
+
| warn | 🤪 | 橙色 | 警告信息 |
|
|
159
|
+
| error | 🥵 | 红色 | 错误信息 |
|
|
160
|
+
| info | 🫣 | 灰色 | 信息提示 |
|
|
161
|
+
| debug | 🧐 | 紫色 | 调试信息 |
|
|
162
|
+
|
|
163
|
+
### 公共实例方法
|
|
164
|
+
|
|
165
|
+
- `logger.log(...args)` - 输出普通日志
|
|
166
|
+
- `logger.success(...args)` - 输出成功日志
|
|
167
|
+
- `logger.warn(...args)` - 输出警告日志
|
|
168
|
+
- `logger.error(...args)` - 输出错误日志
|
|
169
|
+
- `logger.info(...args)` - 输出信息日志
|
|
170
|
+
- `logger.debug(...args)` - 输出调试日志
|
|
171
|
+
- `logger.overrideOriginalLogger()` - 覆盖原生 console 方法
|
|
172
|
+
- `logger.restoreOriginalLogger()` - 恢复原生 console 方法
|
|
173
|
+
- `logger.updateStyleConfig(config)` - 更新当前实例的样式配置
|
|
174
|
+
|
|
175
|
+
### 私有方法(仅供内部使用)
|
|
176
|
+
|
|
177
|
+
以下方法是类的私有方法,不应在外部直接调用:
|
|
178
|
+
|
|
179
|
+
- `#invokeLogger(type, ...args)` - 调用指定类型的日志方法
|
|
180
|
+
- `#getRealInvokeLocation()` - 获取实际调用位置
|
|
181
|
+
- `#getFormattedTime()` - 获取格式化时间
|
|
182
|
+
|
|
183
|
+
### 私有属性(仅供内部使用)
|
|
184
|
+
|
|
185
|
+
以下属性是类的私有属性,不应在外部直接访问:
|
|
186
|
+
|
|
187
|
+
- `#originalConsole` - 存储原始 console 方法的备份
|
|
188
|
+
- `#styleConfig` - 存储当前样式配置
|
|
189
|
+
|
|
190
|
+
### 提示文本功能
|
|
191
|
+
|
|
192
|
+
如果第一个参数是以 `##` 开头的字符串,则该字符串会被识别为提示文本,并以特殊样式显示:
|
|
193
|
+
|
|
194
|
+
```javascript
|
|
195
|
+
logger.success('##操作已完成', '更多日志内容...');
|
|
196
|
+
```
|
|
197
|
+
|
|
198
|
+
## 浏览器兼容性
|
|
199
|
+
|
|
200
|
+
支持现代浏览器,需要支持 `console` API、ES5+ 语法以及 `Error.stack` 属性。注意:私有字段和私有方法需要 ES2022 或更高版本的支持。
|
|
201
|
+
|
|
202
|
+
## 贡献
|
|
203
|
+
|
|
204
|
+
欢迎提交 Issue 和 Pull Request 来改进此项目。
|
|
205
|
+
|
|
206
|
+
## 许可证
|
|
207
|
+
|
|
208
|
+
MIT
|
|
Binary file
|
package/dist/index.cjs
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
"use strict";const r="line-height: 30px; height: 30px; font-size: 16px;",c=`border-radius: 5px; padding: 0 5px; ${r}`,s="border: 2px dashed; margin-left: 5px; border-radius: 5px; padding: 0 5px; line-height: 26px; height: 26px; font-size: 16px; font-weight: bold;",a="padding: 5px 0; font-size: 14px;";class StyledLogger{#e={log:console.log,success:console.success,warn:console.warn,error:console.error,info:console.info,debug:console.debug};#t={log:{prefixStyle:`background: #409EFF; color: white; ${c}`,prefixText:"LOG",icon:"\u{1F601}",iconStyle:r,tipStyle:`color: #409EFF; border-color: #409EFF; ${s}`,realInvokeLocationStyle:a},success:{prefixStyle:`background: #67C23A; color: white; ${c}`,prefixText:"SUCCESS",icon:"\u{1F970}",iconStyle:r,tipStyle:`color: #67C23A; border-color: #67C23A; ${s}`,realInvokeLocationStyle:a},warn:{prefixStyle:`background: #E6A23C; color: white; ${c}`,prefixText:"WARN",icon:"\u{1F92A}",iconStyle:r,tipStyle:`color: #E6A23C; border-color: #E6A23C; ${s}`,realInvokeLocationStyle:a},error:{prefixStyle:`background: #F56C6C; color: white; ${c}`,prefixText:"ERROR",icon:"\u{1F975}",iconStyle:r,tipStyle:`color: #F56C6C; border-color: #F56C6C; ${s}`,realInvokeLocationStyle:a},info:{prefixStyle:`background: #909399; color: white; ${c}`,prefixText:"INFO",icon:"\u{1FAE3}",iconStyle:r,tipStyle:`color: #909399; border-color: #909399; ${s}`,realInvokeLocationStyle:a},debug:{prefixStyle:`background: #EE82EE; color: white; ${c}`,prefixText:"DEBUG",icon:"\u{1F9D0}",iconStyle:r,tipStyle:`color: #EE82EE; border-color: #EE82EE; ${s}`,realInvokeLocationStyle:a}};constructor(o={}){this.updateStyleConfig(o)}#r(){try{throw new Error("")}catch(o){if(!o.stack)return`
|
|
2
|
+
Unknown location
|
|
3
|
+
`;const e=/\r?\n/,i=o.stack.split(e).reverse();for(let n=0;n<i.length;n++){const t=i[n].trim();if(t.includes("at ")){const g=t.match(/at .*? \((.*)\)|at (.*)/);if(g)return`
|
|
4
|
+
RealInvokeLocation: ${g[1]||g[2]}
|
|
5
|
+
`}}return`
|
|
6
|
+
Unknown location
|
|
7
|
+
`}}#n(){const o=new Date;return`${o.getFullYear().toString()}-${o.getMonth().toString().padStart(2,"0")}-${o.getDate().toString().padStart(2,"0")} ${o.getHours().toString().padStart(2,"0")}:${o.getMinutes().toString().padStart(2,"0")}:${o.getSeconds().toString().padStart(2,"0")}.${o.getMilliseconds().toString().padStart(3,"0")}`}#o(o,...e){const i=e[0],n=typeof i=="string"&&i.startsWith("##"),t=n?i.substring(2):"",g=n?e.slice(1):e,p=this.#e[o]||this.#e.log,l=this.#t[o]||this.#t.log,u=this.#n(),S=this.#r();p.apply(console,[`%c${l.icon}%c${l.prefixText} ${u}%c${n?t:""}%c${S}`,l.iconStyle,l.prefixStyle,l.tipStyle,l.realInvokeLocationStyle,...g])}overrideOriginalLogger(){const o=this;console.log=function(...e){o.#o("log",...e)},console.success=function(...e){o.#o("success",...e)},console.warn=function(...e){o.#o("warn",...e)},console.error=function(...e){o.#o("error",...e)},console.info=function(...e){o.#o("info",...e)},console.debug=function(...e){o.#o("debug",...e)}}restoreOriginalLogger(){console.log=this.#e.log,console.warn=this.#e.warn,console.error=this.#e.error,console.info=this.#e.info,console.debug=this.#e.debug,console.success=this.#e.success}updateStyleConfig(o={}){function e(i,n){for(let t in n)n.hasOwnProperty(t)&&(n[t]&&typeof n[t]=="object"&&!Array.isArray(n[t])&&n[t]!==null?(i[t]||(i[t]={}),typeof i[t]=="object"&&i[t]!==null?e(i[t],n[t]):i[t]=n[t]):i[t]=n[t]);return i}e(this.#t,o)}log(...o){this.#o("log",...o)}success(...o){this.#o("success",...o)}warn(...o){this.#o("warn",...o)}error(...o){this.#o("error",...o)}info(...o){this.#o("info",...o)}debug(...o){this.#o("debug",...o)}}exports.StyledLogger=StyledLogger;
|
package/dist/index.d.cts
ADDED
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
declare class StyledLogger {
|
|
2
|
+
#private;
|
|
3
|
+
constructor(styleConfig?: {});
|
|
4
|
+
/**
|
|
5
|
+
* @author: ares
|
|
6
|
+
* @date: 2026/1/16 上午11:19
|
|
7
|
+
* @description: 覆盖原始console方法
|
|
8
|
+
*/
|
|
9
|
+
overrideOriginalLogger(): void;
|
|
10
|
+
/**
|
|
11
|
+
* @author: ares
|
|
12
|
+
* @date: 2026/1/16 上午11:19
|
|
13
|
+
* @description: 还原原始console方法
|
|
14
|
+
*/
|
|
15
|
+
restoreOriginalLogger(): void;
|
|
16
|
+
/**
|
|
17
|
+
* @author: ares
|
|
18
|
+
* @date: 2026/1/16 上午11:19
|
|
19
|
+
* @description: 更新样式配置
|
|
20
|
+
* @param styleConfig
|
|
21
|
+
*/
|
|
22
|
+
updateStyleConfig(styleConfig?: {}): void;
|
|
23
|
+
/**
|
|
24
|
+
* @author: ares
|
|
25
|
+
* @date: 2026/1/16 上午11:19
|
|
26
|
+
* @description: StyledLogger实例log方法
|
|
27
|
+
* @param args
|
|
28
|
+
*/
|
|
29
|
+
log(...args: any[]): void;
|
|
30
|
+
/**
|
|
31
|
+
* @author: ares
|
|
32
|
+
* @date: 2026/1/16 上午11:22
|
|
33
|
+
* @description: StyledLogger实例success方法
|
|
34
|
+
* @param args
|
|
35
|
+
*/
|
|
36
|
+
success(...args: any[]): void;
|
|
37
|
+
/**
|
|
38
|
+
* @author: ares
|
|
39
|
+
* @date: 2026/1/16 上午11:22
|
|
40
|
+
* @description: StyledLogger实例warn方法
|
|
41
|
+
* @param args
|
|
42
|
+
*/
|
|
43
|
+
warn(...args: any[]): void;
|
|
44
|
+
/**
|
|
45
|
+
* @author: ares
|
|
46
|
+
* @date: 2026/1/16 上午11:22
|
|
47
|
+
* @description: StyledLogger实例error方法
|
|
48
|
+
* @param args
|
|
49
|
+
*/
|
|
50
|
+
error(...args: any[]): void;
|
|
51
|
+
/**
|
|
52
|
+
* @author: ares
|
|
53
|
+
* @date: 2026/1/16 上午11:22
|
|
54
|
+
* @description: StyledLogger实例info方法
|
|
55
|
+
* @param args
|
|
56
|
+
*/
|
|
57
|
+
info(...args: any[]): void;
|
|
58
|
+
/**
|
|
59
|
+
* @author: ares
|
|
60
|
+
* @date: 2026/1/16 上午11:22
|
|
61
|
+
* @description: StyledLogger实例debug方法
|
|
62
|
+
* @param args
|
|
63
|
+
*/
|
|
64
|
+
debug(...args: any[]): void;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
export { StyledLogger };
|
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
declare class StyledLogger {
|
|
2
|
+
#private;
|
|
3
|
+
constructor(styleConfig?: {});
|
|
4
|
+
/**
|
|
5
|
+
* @author: ares
|
|
6
|
+
* @date: 2026/1/16 上午11:19
|
|
7
|
+
* @description: 覆盖原始console方法
|
|
8
|
+
*/
|
|
9
|
+
overrideOriginalLogger(): void;
|
|
10
|
+
/**
|
|
11
|
+
* @author: ares
|
|
12
|
+
* @date: 2026/1/16 上午11:19
|
|
13
|
+
* @description: 还原原始console方法
|
|
14
|
+
*/
|
|
15
|
+
restoreOriginalLogger(): void;
|
|
16
|
+
/**
|
|
17
|
+
* @author: ares
|
|
18
|
+
* @date: 2026/1/16 上午11:19
|
|
19
|
+
* @description: 更新样式配置
|
|
20
|
+
* @param styleConfig
|
|
21
|
+
*/
|
|
22
|
+
updateStyleConfig(styleConfig?: {}): void;
|
|
23
|
+
/**
|
|
24
|
+
* @author: ares
|
|
25
|
+
* @date: 2026/1/16 上午11:19
|
|
26
|
+
* @description: StyledLogger实例log方法
|
|
27
|
+
* @param args
|
|
28
|
+
*/
|
|
29
|
+
log(...args: any[]): void;
|
|
30
|
+
/**
|
|
31
|
+
* @author: ares
|
|
32
|
+
* @date: 2026/1/16 上午11:22
|
|
33
|
+
* @description: StyledLogger实例success方法
|
|
34
|
+
* @param args
|
|
35
|
+
*/
|
|
36
|
+
success(...args: any[]): void;
|
|
37
|
+
/**
|
|
38
|
+
* @author: ares
|
|
39
|
+
* @date: 2026/1/16 上午11:22
|
|
40
|
+
* @description: StyledLogger实例warn方法
|
|
41
|
+
* @param args
|
|
42
|
+
*/
|
|
43
|
+
warn(...args: any[]): void;
|
|
44
|
+
/**
|
|
45
|
+
* @author: ares
|
|
46
|
+
* @date: 2026/1/16 上午11:22
|
|
47
|
+
* @description: StyledLogger实例error方法
|
|
48
|
+
* @param args
|
|
49
|
+
*/
|
|
50
|
+
error(...args: any[]): void;
|
|
51
|
+
/**
|
|
52
|
+
* @author: ares
|
|
53
|
+
* @date: 2026/1/16 上午11:22
|
|
54
|
+
* @description: StyledLogger实例info方法
|
|
55
|
+
* @param args
|
|
56
|
+
*/
|
|
57
|
+
info(...args: any[]): void;
|
|
58
|
+
/**
|
|
59
|
+
* @author: ares
|
|
60
|
+
* @date: 2026/1/16 上午11:22
|
|
61
|
+
* @description: StyledLogger实例debug方法
|
|
62
|
+
* @param args
|
|
63
|
+
*/
|
|
64
|
+
debug(...args: any[]): void;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
export { StyledLogger };
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
declare class StyledLogger {
|
|
2
|
+
#private;
|
|
3
|
+
constructor(styleConfig?: {});
|
|
4
|
+
/**
|
|
5
|
+
* @author: ares
|
|
6
|
+
* @date: 2026/1/16 上午11:19
|
|
7
|
+
* @description: 覆盖原始console方法
|
|
8
|
+
*/
|
|
9
|
+
overrideOriginalLogger(): void;
|
|
10
|
+
/**
|
|
11
|
+
* @author: ares
|
|
12
|
+
* @date: 2026/1/16 上午11:19
|
|
13
|
+
* @description: 还原原始console方法
|
|
14
|
+
*/
|
|
15
|
+
restoreOriginalLogger(): void;
|
|
16
|
+
/**
|
|
17
|
+
* @author: ares
|
|
18
|
+
* @date: 2026/1/16 上午11:19
|
|
19
|
+
* @description: 更新样式配置
|
|
20
|
+
* @param styleConfig
|
|
21
|
+
*/
|
|
22
|
+
updateStyleConfig(styleConfig?: {}): void;
|
|
23
|
+
/**
|
|
24
|
+
* @author: ares
|
|
25
|
+
* @date: 2026/1/16 上午11:19
|
|
26
|
+
* @description: StyledLogger实例log方法
|
|
27
|
+
* @param args
|
|
28
|
+
*/
|
|
29
|
+
log(...args: any[]): void;
|
|
30
|
+
/**
|
|
31
|
+
* @author: ares
|
|
32
|
+
* @date: 2026/1/16 上午11:22
|
|
33
|
+
* @description: StyledLogger实例success方法
|
|
34
|
+
* @param args
|
|
35
|
+
*/
|
|
36
|
+
success(...args: any[]): void;
|
|
37
|
+
/**
|
|
38
|
+
* @author: ares
|
|
39
|
+
* @date: 2026/1/16 上午11:22
|
|
40
|
+
* @description: StyledLogger实例warn方法
|
|
41
|
+
* @param args
|
|
42
|
+
*/
|
|
43
|
+
warn(...args: any[]): void;
|
|
44
|
+
/**
|
|
45
|
+
* @author: ares
|
|
46
|
+
* @date: 2026/1/16 上午11:22
|
|
47
|
+
* @description: StyledLogger实例error方法
|
|
48
|
+
* @param args
|
|
49
|
+
*/
|
|
50
|
+
error(...args: any[]): void;
|
|
51
|
+
/**
|
|
52
|
+
* @author: ares
|
|
53
|
+
* @date: 2026/1/16 上午11:22
|
|
54
|
+
* @description: StyledLogger实例info方法
|
|
55
|
+
* @param args
|
|
56
|
+
*/
|
|
57
|
+
info(...args: any[]): void;
|
|
58
|
+
/**
|
|
59
|
+
* @author: ares
|
|
60
|
+
* @date: 2026/1/16 上午11:22
|
|
61
|
+
* @description: StyledLogger实例debug方法
|
|
62
|
+
* @param args
|
|
63
|
+
*/
|
|
64
|
+
debug(...args: any[]): void;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
export { StyledLogger };
|
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
const i="line-height: 30px; height: 30px; font-size: 16px;",l=`border-radius: 5px; padding: 0 5px; ${i}`,s="border: 2px dashed; margin-left: 5px; border-radius: 5px; padding: 0 5px; line-height: 26px; height: 26px; font-size: 16px; font-weight: bold;",a="padding: 5px 0; font-size: 14px;";class d{#e={log:console.log,success:console.success,warn:console.warn,error:console.error,info:console.info,debug:console.debug};#t={log:{prefixStyle:`background: #409EFF; color: white; ${l}`,prefixText:"LOG",icon:"\u{1F601}",iconStyle:i,tipStyle:`color: #409EFF; border-color: #409EFF; ${s}`,realInvokeLocationStyle:a},success:{prefixStyle:`background: #67C23A; color: white; ${l}`,prefixText:"SUCCESS",icon:"\u{1F970}",iconStyle:i,tipStyle:`color: #67C23A; border-color: #67C23A; ${s}`,realInvokeLocationStyle:a},warn:{prefixStyle:`background: #E6A23C; color: white; ${l}`,prefixText:"WARN",icon:"\u{1F92A}",iconStyle:i,tipStyle:`color: #E6A23C; border-color: #E6A23C; ${s}`,realInvokeLocationStyle:a},error:{prefixStyle:`background: #F56C6C; color: white; ${l}`,prefixText:"ERROR",icon:"\u{1F975}",iconStyle:i,tipStyle:`color: #F56C6C; border-color: #F56C6C; ${s}`,realInvokeLocationStyle:a},info:{prefixStyle:`background: #909399; color: white; ${l}`,prefixText:"INFO",icon:"\u{1FAE3}",iconStyle:i,tipStyle:`color: #909399; border-color: #909399; ${s}`,realInvokeLocationStyle:a},debug:{prefixStyle:`background: #EE82EE; color: white; ${l}`,prefixText:"DEBUG",icon:"\u{1F9D0}",iconStyle:i,tipStyle:`color: #EE82EE; border-color: #EE82EE; ${s}`,realInvokeLocationStyle:a}};constructor(o={}){this.updateStyleConfig(o)}#r(){try{throw new Error("")}catch(o){if(!o.stack)return`
|
|
2
|
+
Unknown location
|
|
3
|
+
`;const e=/\r?\n/,n=o.stack.split(e).reverse();for(let r=0;r<n.length;r++){const t=n[r].trim();if(t.includes("at ")){const g=t.match(/at .*? \((.*)\)|at (.*)/);if(g)return`
|
|
4
|
+
RealInvokeLocation: ${g[1]||g[2]}
|
|
5
|
+
`}}return`
|
|
6
|
+
Unknown location
|
|
7
|
+
`}}#n(){const o=new Date;return`${o.getFullYear().toString()}-${o.getMonth().toString().padStart(2,"0")}-${o.getDate().toString().padStart(2,"0")} ${o.getHours().toString().padStart(2,"0")}:${o.getMinutes().toString().padStart(2,"0")}:${o.getSeconds().toString().padStart(2,"0")}.${o.getMilliseconds().toString().padStart(3,"0")}`}#o(o,...e){const n=e[0],r=typeof n=="string"&&n.startsWith("##"),t=r?n.substring(2):"",g=r?e.slice(1):e,p=this.#e[o]||this.#e.log,c=this.#t[o]||this.#t.log,u=this.#n(),S=this.#r();p.apply(console,[`%c${c.icon}%c${c.prefixText} ${u}%c${r?t:""}%c${S}`,c.iconStyle,c.prefixStyle,c.tipStyle,c.realInvokeLocationStyle,...g])}overrideOriginalLogger(){const o=this;console.log=function(...e){o.#o("log",...e)},console.success=function(...e){o.#o("success",...e)},console.warn=function(...e){o.#o("warn",...e)},console.error=function(...e){o.#o("error",...e)},console.info=function(...e){o.#o("info",...e)},console.debug=function(...e){o.#o("debug",...e)}}restoreOriginalLogger(){console.log=this.#e.log,console.warn=this.#e.warn,console.error=this.#e.error,console.info=this.#e.info,console.debug=this.#e.debug,console.success=this.#e.success}updateStyleConfig(o={}){function e(n,r){for(let t in r)r.hasOwnProperty(t)&&(r[t]&&typeof r[t]=="object"&&!Array.isArray(r[t])&&r[t]!==null?(n[t]||(n[t]={}),typeof n[t]=="object"&&n[t]!==null?e(n[t],r[t]):n[t]=r[t]):n[t]=r[t]);return n}e(this.#t,o)}log(...o){this.#o("log",...o)}success(...o){this.#o("success",...o)}warn(...o){this.#o("warn",...o)}error(...o){this.#o("error",...o)}info(...o){this.#o("info",...o)}debug(...o){this.#o("debug",...o)}}export{d as StyledLogger};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
|
|
2
|
+
export {};
|
|
3
|
+
|
|
4
|
+
declare global {
|
|
5
|
+
interface Console {
|
|
6
|
+
// 直接扩展 console 接口
|
|
7
|
+
success?: (...args: any[]) => void;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
type Recordable<K extends string | number | symbol = string, T = any> = Record<
|
|
11
|
+
K extends null | undefined ? string : K,
|
|
12
|
+
T
|
|
13
|
+
>
|
|
14
|
+
|
|
15
|
+
}
|
package/package.json
ADDED
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "ares-styled-logger",
|
|
3
|
+
"version": "1.2.0",
|
|
4
|
+
"description": "styled console",
|
|
5
|
+
"main": "./dist/index.cjs",
|
|
6
|
+
"module": "./dist/index.mjs",
|
|
7
|
+
"types": "./dist/types/index.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"types": "./dist/types/index.d.ts",
|
|
11
|
+
"import": "./dist/index.mjs",
|
|
12
|
+
"require": "./dist/index.cjs"
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
"author": "ares <18292577207@126.com>",
|
|
16
|
+
"license": "MIT"
|
|
17
|
+
}
|