English | 简体中文
A front-end developer tool for mobile web page.
vConsole is a mobile front-end developer tool which can be very helpful for debug and development.
http://wechatfe.github.io/vconsole/demo.html
Download file dist/vconsole.min.js to your project's directory.
Or, install via npm :
npm install vconsole
(1) Under non-AMD/CMD rule, insert vConsole into <head>. To support further features, insert vConsole into <head> rather than </body> is a better choice.
<head>
<script src="path/to/vconsole.min.js"></script>
</head>
(2) Under AMD/CMD rule, use require() to import vConsole.
var vConsole = require('path/to/vconsole.min.js');
(1) Use the methods of console to print logs, just like what you do at desktop browsers:
console.log('Hello World');
When vConsole is not loaded, logs will be printed to native console. After importing vConsole, logs will be printed to both front-end console and native console.
(2) 5 types of log method are supported, with different styles:
console.log('foo'); // black word, white bakcground
console.info('bar'); // purple word, white background
console.debug('oh'); // orange word, white background
console.warn('foo'); // orange word, yellow background
console.error('bar'); // red word, pink background
(3) Object or Array variable will be printed as formatted JSON:
var obj = {};
obj.foo = 'bar';
console.log(obj);
/*
Object
{
foo: "bar"
}
*/
(4) Multiple arguments are supported, each variable will be divided by a space:
var uid = 233;
console.log('UserID:', uid); // UserID: 233
(5) Use [default|system|...] string to print logs to specific panel:
// [xxx] must be at the beginning of a log
console.log('[system]', 'foo');
console.log('[system] bar');
// foo & bar will be printed to system panel
Supported panels:
[default] Log panel (default)
[system] System panel
[network] Network panel
(1) After importing vConsole, a button, which can show/hide panel, will be displayed at the right bottom of the page.
Under production environment, DO NOT import vConsole to your page, unless you want to let your users help you to debug. Demo example/demo2.php shows how to import vConsole dynamicly.
(2) After v1.2.0, vConsole.ready() is deprecated. You can directly use console.log() after importing vConsole without waiting for its ready. This method will be removed at v2.0.0 and later.
The MIT License (http://opensource.org/licenses/MIT)
v1.3.0 (2016-05-20)
Feat Support Drag and Drop switch button.Fix Fix initialization failure when loaded asynchronously.FAQs
A lightweight, extendable front-end developer tool for mobile web page.
The npm package vconsole receives a total of 32,583 weekly downloads. As such, vconsole popularity was classified as popular.
We found that vconsole demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
ESLint has added JSON and Markdown linting support with new officially-supported plugins, expanding its versatility beyond JavaScript.
Security News
Members Hub is conducting large-scale campaigns to artificially boost Discord server metrics, undermining community trust and platform integrity.
Security News
NIST has failed to meet its self-imposed deadline of clearing the NVD's backlog by the end of the fiscal year. Meanwhile, CVE's awaiting analysis have increased by 33% since June.