webstorm配置console.log打印

一、设置面板

打开设置面板(windows 快捷键: ctrl + alt + s) ,找到 编辑器 -> 实时模板 -> JavaScript -> log,点击log会出现对应的配置

二、模板文本

将下面这些模板文本粘贴进去

复制代码
console.info("🚀 ~ file:$file$ method:$method$ line:$line$ -----", $PARAM$)

三、编辑变量

点击模板右边的【编辑变量】按钮,选择变量表达式,配置完成后点击【确定】

四、生效文件

点击左下角的【更改】,弹窗中勾选【JavaScript和TypeScript】、【TypeScript】和【Vue】

五、使用log

输入 log 然后 tab 直接生成打印模板信息

六、打印效果

以下就是打印信息,包含:文件名、方法名、行数

相关推荐
学习智者13 小时前
《玄》IDE v3.6.3重磅发布:全功能修复与性能飞跃
开发语言·c++·ide·算法·中文语言 玄
重生之小比特14 小时前
【Java SE】IDEA 调试 Debug 案例完整分析
java·ide·intellij-idea
Danny_姜16 小时前
Android Studio Quail 4 稳定版发布:本地 Gemma 4 + Android Skills
android·ide·android studio
withoutfear1 天前
IntelliJ IDEA卡顿内存分配不足和索引被频繁触发问题解决办法
java·ide·intellij-idea
寥落半伤感2 天前
在Pycharm中一键迅速安装包及查看虚拟环境中包名的方法
ide·python·pycharm
进击的炸酱面2 天前
如何在服务器中使用codex?代理配置一图详解
ide·vscode·ssh
持敬chijing2 天前
VSCode 远程开发环境完整搭建指南:汉化、SSH 免密连接与版本更新锁定
ide·vscode·ssh
2501_915918413 天前
在Windows10上使用VSCode和Code Runner搭建Swift开发环境详细步骤
ide·vscode·ios·objective-c·个人开发·swift·敏捷流程
墨白曦煜3 天前
穿透 IDE 的障眼法:Git 四大工作区与核心数据流转解析
ide·git
kqz20144 天前
Android Studio Commit 面板临时文件.gitignore
ide·android studio·intellij-idea