vuejs-logger is to provide customizable logging functionality for Vue.js. Compatible with Vue2.
vue logger plugin, vuejs logging to file, vue 3 logging, vuejs logger example, vue log viewer, vue log4j, how to log data in vue js, client side logging vue
vuejs-logger is a tool that enables configurable logging for Vue applications. Features include :
- Output restriction based on selected loglevel.
- Automatically JSON.stringify() the (reactive) properties passed to the logger.
- Configurable options to customize output for log messages.
- Colored console messages for $log.warning, $log.error and $log.fatal.
How to make use of it:
Install & Download:
$ npm install vuejs-logger --save-exact
Usage
import VueLogger from 'vuejs-logger';
const isProduction = process.env.NODE_ENV === 'production';
const options = {
isEnabled: true,
logLevel : isProduction ? 'error' : 'debug',
stringifyArguments : false,
showLogLevel : true,
showMethodName : true,
separator: '|',
showConsoleColors: true
};
Vue.use(VueLogger, options);
new Vue({
data() {
return {
a : 'a',
b : 'b'
}
},
created() {
this.$log.debug('test', this.a, 123)
this.$log.info('test', this.b)
this.$log.warn('test')
this.$log.error('test')
this.$log.fatal('test')
externalFunction()
}
});
function externalFunction() {
// log from external function
Vue.$log.debug('log from function outside component.');
}
Properties
| Name | Required | Type | Default | Description |
|---|---|---|---|---|
| isEnabled | false | Boolean | true | Enables the vuejs-logger plugin, a useful toggle for production/development. |
| logLevel | false | String | ‘debug’ | Choose between [‘debug’, ‘info’, ‘warn’, ‘error’, ‘fatal’]. Read production tips. |
| stringifyArguments | false | Boolean | false | If true, all input will go through JSON.stringify(). Useful when printing reactive properties. |
| showLogLevel | false | Boolean | false | If true, the loglevel will be shown. |
| showMethodName | false | Boolean | false | If true, the method name of the parent function will be shown in the console. |
| separator | false | String | ‘ l ‘ | The separator between parts of the output (sees screenshot. |
| showConsoleColors | false | Boolean | false | If true, enables console.warn, console.fatal, console.error for corresponding loglevels. |
customizable logging, vuejs-logger Plugin/Github
See Demo And Download
Official Website(justinkames): Click Here
This superior jQuery/javascript plugin is developed by justinkames. For extra advanced usage, please go to the official website.
