console-debug-pro
v1.0.22
Published
Clickable console.log with file:line:col and VS Code snippet auto-setup
Maintainers
Readme
An advanced debugging utility that transforms your console.log into clickable file links directly in your terminal.
Stop wasting time searching for your code — just click and go straight to the line in VS Code.
📸 Demo Preview
Click on the line number in the terminal → the file opens directly in VS Code!

🤔 Why Use This Package?
Developers spend too much time hunting down the source of a console.log.
Console Debug Pro automates this process. It enriches your log output with the file name and line number, giving you a one-click path straight to the code.
This makes your debugging workflow up to 10x faster.
✨ Features
✅ Clickable Logs — Open files and line numbers from your terminal directly into VS Code.
✅ Clickable File Paths — Open files in VS Code at the exact line & column.
✅ Short Path Mode — Shows only the last folder and file name instead of long paths
✅ Auto Snippet Installation — Instantly insert a
console.logwith file and line number by typingcs.✅ Colored Output — Path in
yellow, line number in blue for better readability.✅ Command Shortcuts:
- cd → Inserts console.log('DeBug--- line 181:', ) with line number.
- cf → Inserts debug.logn() that also opens file & line number in VS Code instantly.
✅ Universal Compatibility — Works with Node.js, React, Vue, Angular, Next.js, Express, and all major frameworks.
✅ Ultra-Lightweight — Only in size, adding no overhead to your project.
✅ Customizable — Change the log prefix to fit your preferences.
✅ Error-Safe — If the package fails, it falls back to native
console.logwithout breaking your app.
💻 Supported Frameworks
Frontend: React, Vue, Angular, Svelte, Next.js, Nuxt.js, Remix
Backend: Node.js, Express, NestJS, Fastify, Koa, AdonisJS
Full-Stack: Meteor, Blitz.js, Redwood.js
📦 Installation
Using npm:
npm install console-debug-pro --save-dev
🛠️ Usage: 1. Import it into your project
import debug from 'console-debug-pro';
// Or for CommonJS
const debug = require('console-debug-pro');2. Usag it: It works just like a normal console.log.
// Basic usage
debug.log('This is my message.');
// Output: DeBug---> controllers/postController.js --> 174:1 This is my message.
// Short usage
console.log('DeBug--- line 181:','This is my message.' );
// Output: DeBug--->174:1 This is my message.
// With variables
const user = { id: 1, name: 'John' };
debug.log('User object:', user);
// Output: DeBug---> controllers/postController.js --> 174:1 User object: { id: 1, name: 'John' }
3. Use the Auto-Snippet in VS Code (The Magic ✨) It works just like a normal console.log.
- Type cs and press Tab.
- It will automatically insert: debug('DeBug--- line X:', );
Shortcut Description
`cd` Inserts `console.log('DeBug--- line 181:', )` with line number.
`cf` Inserts `debug.logn()` that also opens file & line number in VS Code instantly.🗺️ Roadmap
- Support for additional themes and color options.
- Snippet support for WebStorm and other IDEs.
- Add support for log levels (info, debug, trace).
🤝 Contributing
Contributions are always welcome!
If you'd like to make improvements, please create a Pull Request. For any bugs or feature requests, please create an Issue.
GitHub: Samyy-decod
🧑💻 Author
- GitHub: codingyaari
