@woolson/logger

0.0.5 • Public • Published

JS Logger | JS日志

好看的、好用的、清晰的log信息

Installing

使用npm(推荐):

$ npm install --save-dev @woolson/logger

HTML引入:

<script src="../somepath/logger.min.js"></script>

示例

传统项目

// 可在初始化的时候配置
var logger = new Logger({})
// 具体方法
logger.log('Hello world')
logger.warn('Hello world')
logger.error('Hello world')
logger.debug('title', 'Hello world') or logger.debug('Hello world')
logger.server(data)

Vue项目中

import Logger from '@woolson/logger'

// 可在初始化的时候配置
Vue.use(Logger, config)

// 可以再每个组件中使用
this.$log('Hello world')
this.$warn('Hello world')
this.$error('Hello world')
this.$debug('title', 'Hello world') or this.debug('Hello world')
logger.$server(data)

TODO

  • 收集错误和提升体验

配置

配置 类型 描述
colored Boolean 是否使用颜色,默认true
logLevel String log、 warn、 error(debug)在log等级才会显示,默认log
dateTemp String log的时间格式,默认HH:mm:SS,具体配置可参考moment(部分支持)
debugTitleSize Number debug模式标题的字体大小,默认大小14
catchErrorUrl String server方法把错误信息传到后端的接口

方法

log

logger.log('Hello world')

warn

logger.warn('Hello world')

error

logger.error('Hello world')

debug

可在debug时候使用,颜色随机以便区分区域

logger.debug('Hello world')
logger.debug('订单数据', {obj: 123})

server

收集用户端的错误信息,可尽快知晓和定位错误

客户端

logger.server(data)

服务端

// /api/catchError 为配置中的接口
app.post('/api/catchError', function (req, res) {
	var body = req.body
	var logPath = path.join(__dirname, '/static/error.log')
	var date = utils.moment.getCurrent('YYYY-MM-DD HH:mm:SS')
	var content = [
		`${'='.repeat(15)}${date}${'='.repeat(15)}\n`,
		`Error: ${body.msg};\n`,
		`ErrorFile: ${body.url};\n`,
		`ErrorLine: ${body.line};\n`,
		`ErrorColumn: ${body.col};\n`,
		`${'='.repeat(49)}\n\n\n`,
	]
	fs.appendFileSync(logPath, content.join(''))
	res.send({success: true})
})


woolson

Package Sidebar

Install

npm i @woolson/logger

Weekly Downloads

5

Version

0.0.5

License

MIT

Last publish

Collaborators

  • woolson