DotLog Magic

一个神奇的 Visual Studio Code 插件,让你只需在变量后添加 .log 即可瞬间生成 console.log 语句,让调试变得简单而高效。
🚀 功能特性
- ⚡ 极速生成:只需在变量后输入
.log 并按回车,瞬间生成完整的 console.log 语句
- 🎯 智能识别:自动识别变量名并生成格式化的日志输出
- 🔥 即时触发:支持实时监听,输入即转换
- ⌨️ 快捷键支持:
Ctrl+Shift+L (Windows/Linux) 或 Cmd+Shift+L (Mac) 快速生成
- 📝 格式化输出:生成带有 🚀 标识和变量描述的日志语句
- 🌈 多语言支持:完美支持 JavaScript、TypeScript 等语言
📦 安装方式
方式一:VS Code 扩展市场
- 打开 VS Code
- 按
Ctrl+Shift+X 打开扩展面板
- 搜索
DotLog Magic
- 点击安装
方式二:命令行安装
code --install-extension akimixu.dotlog-magic
🎮 使用方法
方法一:自动触发(推荐)
- 编写代码,例如:
const userName = 'Alice'
- 在变量名后输入
.log :userName.log
- 按回车键,自动转换为:
const userName = 'Alice';
console.log("🚀这是userName的输出:", userName);
方法二:快捷键触发
- 将光标放在包含
.log 的行上
- 按
Ctrl+Shift+L (Windows/Linux) 或 Cmd+Shift+L (Mac)
- 自动生成对应的 console.log 语句
📖 使用示例
基础用法
// 输入
const apiResponse = await fetch('/api/data')
apiResponse.log
// 自动转换为
const apiResponse = await fetch('/api/data');
console.log("🚀这是apiResponse的输出:", apiResponse);
复杂表达式
// 输入
const result = calculateTotal(items)
result.log
// 自动转换为
const result = calculateTotal(items);
console.log("🚀这是result的输出:", result);
⚙️ 支持的语言
- ✅ JavaScript (.js)
- ✅ TypeScript (.ts)
- ✅ JSX (.jsx)
- ✅ TSX (.tsx)
- ✅ Vue (.vue)
- ✅ 其他支持 console.log 的语言
🛠️ 配置选项
目前插件开箱即用,无需额外配置。未来版本将支持:
🤝 贡献指南
欢迎参与项目贡献!
- Fork 项目
- 创建特性分支:
git checkout -b feature/AmazingFeature
- 提交更改:
git commit -m 'Add some AmazingFeature'
- 推送到分支:
git push origin feature/AmazingFeature
- 提交 Pull Request
📝 更新日志
v1.0.1
- 🎉 首次发布
- ✨ 支持 .log 后缀自动转换
- ⌨️ 添加快捷键支持
- 🎨 优化日志输出格式
🐛 问题反馈
遇到问题?欢迎反馈!
📄 许可证
本项目基于 MIT 许可证开源。
享受高效的调试体验! 🎯
| |