@xxk123/pretty-console-log
v1.2.9
Published
一个花式打印log的库
Downloads
197
Readme
这是一个在浏览器上花式打印的项目,可以打印图片和文字,并且可以设置打印的颜色,支持配置文件
如何使用
引入方法
npm install @xxk123/pretty-console-log -S
使用方法
1.首先在vite.config.js引入
import jsonInjectorPlugin from "@xxk123/pretty-console-log/config"
2.在项目根目录下创建config.json文件,并可以添加以下options配置
//默认配置:
{
"enabled": true,/* 是否开启打印 */
"hasborder": true,/* 打印的内容是否有边框 */
"heightLight": false,/* 内容颜色是否为亮色 */
"maxDepth": 12,// 打印的最大深度
"use": {
"production": false // 是否在生产环境中使用
},
"img": {
"maxHeight": 300,/* 打印图片在控制台最大的高度 */
"maxWidth": 400,/* 打印图片在控制台最大的宽度 */
},
"base":{
"title": "Base",/* 打印的题目 */
"titleColor": "white",/* 题目的颜色 */ /* 颜色的支持英文颜色(比如:yellow) 和 HEX格式(比如#fff 或者 #ffffff) */
"contentColor": "grey", /* 内容区的颜色 */
"backgroundColor": "grey",/* 背景颜色 */
"borderColor": "grey", /* 边框颜色 */
},
"info":{
"title": "Info",/* 打印的题目 */
"titleColor": "white",/* 题目的颜色 */ /* 颜色的支持英文颜色(比如:yellow) 和 HEX格式(比如#fff 或者 #ffffff) */
"contentColor": "grey", /* 内容区的颜色 */
"backgroundColor": "grey",/* 背景颜色 */
"borderColor": "grey", /* 边框颜色 */
},
"error": {
"title": "error",
"titleColor": "white",
"contentColor": "red",
"backgroundColor": "red",
"borderColor": "red",
},
"success": {
"title": "success",
"titleColor": "white",
"contentColor": "green",
"backgroundColor": "green",
"borderColor": "green",
},
"warning": {
"title": "warn",
"titleColor": "white",
"contentColor": "orange",
"backgroundColor": "orange",
"borderColor": "orange",
}
}
3.并且在vite.config.js中添加
plugins:[
jsonInjectorPlugin({
path: './config.json',
})
]
在需要使用的地方引入
import log from '@xxk123/pretty-console-log'
import log from '@xxk123/pretty-console-log'
//content为打印的内容,name为打印的名称
log(content,?name); //options选项的base配置会修改此方法打印的内容
log.info(content,?name);
log.error(content,?name);
log.success(content,?name);
log.warning(content,?name);
log.equal(value1,value2); //value1和value2为需要比较的值
log.picture(src); //src为图片的路径,确保图片服务器开启跨域请求
log.setconfig(options); //options为配置项,在调用此方法后的所有打印都按照此配置项进行打印