English | 简体中文
A lightweight, extendable front-end developer tool for mobile web page.
vConsole is framework-free, you can use it in Vue or React or any other framework application.
Now vConsole is the official debugging tool for WeChat Miniprograms.
console.log|info|error|...XMLHttpRequest, Fetch, sendBeaconCookies, LocalStorage, SessionStorageFor details, please see the screenshots below.
Latest version: 
Detailed release notes for each version are available on Changelog.
See Tutorial for more usage details.
For installation, there are 2 primary ways of adding vConsole to a project:
$ npm install vconsole
import { VConsole } from 'vconsole';
const vConsole = new VConsole();
// or init with options
const vConsole = new VConsole({ maxLogNumber: 1000 });
// call `console` methods as usual
console.log('Hello world');
// remove it when you finish debugging
vConsole.destroy();
<script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js"></script>
<script>
// VConsole will be exported to `window.VConsole` by default.
var vConsole = new window.VConsole();
</script>
Available CDN:
http://wechatfe.github.io/vconsole/demo.html
| Overview: | |
| Light theme | Dark theme |
 |  |
| Log Panel: | |
| Log styling | Command line |
 |  |
| System Panel: | |
| Performance info | Output logs to different panel |
 | console.log('[system]', 'output to system panel.') |
| Network Panel: | |
| Request details | |
 | |
| Element Panel: | |
| Realtime HTML elements structure | |
 | |
| Storage Panel: | |
| Add, edit, delete or copy Cookies / LocalStorage / SessionStorage | |
 |
vConsole:
Plugin:
QQ Group: 497430533
3.10.0 (2021-12-17)
In this version, we refactored a lot of core logic, and used Svelte as the rendering engine for all views.
So there are some breaking changes, a small number of methods and properties are not forward compatible.
If you are a vConsole plugin developer, you should pay attention to these changes.
Breaking Changes:
Refactor(Core|Log|Network|Element) Rebuild all views by using Svelte as template engine.Refactor(Core) Remove vConsole.(tabList | activedTab | $dom) properties.Refactor(Plugin) Rename vConsole.showTab(pluginID) to vConsole.showPlugin(pluginID).Refactor(Plugin) Change callback option { data, onClick } of plugin event addTopBar: onClick method will receive 2 arguments (which was 0 before): (event: Event, data?: any) => boolean, which data is the above option's data field.Feat(Core) Remove helper functions vConsole.tool and vConsole.$.Common Updates:
Feat(Log) Support object's Symbol keys.Feat(Log) Support multi-level keyword hint in Log's command line input.Feat(Log) Support string formatting %s, %d, %o, and better %c CSS styling formatting.Feat(Log) Add pagination to objects or arrays to improve rendering performance, with 50 key-values per page.Feat(Network) Add copy buttons to request attributes.Feat(Element) Improve UX, selected node will be highlighted and applied to Expand/Collapse action.Feat(Style) Style tags will be loaded into <head> after vConsole initialization, and removed after destruction.Refactor(Storage) Improve UX.Fix(Network) Throw error when Fetch get an error. (issue #458)FAQs
A lightweight, extendable front-end developer tool for mobile web page.
The npm package vconsole receives a total of 36,918 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
The Socket Research team breaks down a malicious npm package targeting the legitimate DOMPurify library. It uses obfuscated code to hide that it is exfiltrating browser and crypto wallet data.
Security News
ENISA’s 2024 report highlights the EU’s top cybersecurity threats, including rising DDoS attacks, ransomware, supply chain vulnerabilities, and weaponized AI.
Security News
NIST's new password guidelines remove periodic changes and special character requirements, focusing on longer, more secure passwords for better authentication practices.