vscode插件报错: problemmatcher 引用无效: $esbuild-watch

vscode 插件 esbuild类型提示报错

最近在上手开发vscode插件,demo阶段就遇到了一个小问题。 搜索引擎没有特别好的回答, 记录一下,以供查漏补缺。

vscode插件开发

做为一统前端的开发插件,vscode+其丰富的插件能力,共同构建了欣欣向荣的vscode 插件。在团队效率方面,也是不可或缺的利器。

开发文档就不说了,直接看官网很详细:https://code.visualstudio.com/api。 跟着跑了一遍,明白下大概得理念就可以跟着开发自己功能。

问题出现: problemmatcher 引用无效: $esbuild-watch

本来很愉快的基于第一个扩展 进行了项目初始化和安装。

因为对于esbuild的偏爱,所以yo初始化是选择了 esbuild做为打包工具。

结果问题出现了,在进行

// 执行调试
Debug: Start Debugging

vscode 开始报错:

ps: 其实vscode 晚点也会给出解决建议:

但是,手快的下意识行为已经打开了,具体信息

Activating task providers npm
错误: problemMatcher 引用无效: $esbuild-watch

问题解决

面对不熟悉的领域,问题出现直接搜索引擎就行了,但是这次直接给我看懵逼了。
直接搜索上面报错,找到了微软的官方文章。https://marketplace.visualstudio.com/items?itemName=connor4312.esbuild-problem-matchers

其实没注意这里就是对应插件了, 看了看 是介绍如何使用这个插件的。
下意识行为 不应该额外手动安装插件。 就忽略了。

gpt提示:版本匹配问题。

目标不明确直接问了gpt,得出了一下提示。

检查 VSCode 版本是否较新,更新到最新版本。

重启 VSCode,有时候这可以解决临时性问题。

手动添加 $esbuild-watch 到 problemMatcher:
"problemMatcher": [
"$esbuild-watch"
]

尝试使用不同的匹配模式,比如:
"problemMatcher": [
{
"base": "$esbuild-watch",
"background": {
"activeOnStart": true,
"beginsPattern": "^\\swatching\\s",
"endsPattern": ""
}
}
]

下面就是各种检查了,问题都是对得上,问题陷入纠结中。

问题解决

毕竟是task.json 的报错,其实大部分情况下直接查看官方文档是最有效的。我就找到了这篇: https://code.visualstudio.com/Docs/editor/tasks

作用就是 在task 输出 log 中查找对应标识,以确定哪个任务除了异常。

既然如此 那就找

esbuild.js --watch problemMatcher

找到了这篇文章 https://github.com/connor4312/esbuild-problem-matchers 定睛一眼,这不刚才那个插件吗。

果然安装了对应插件之后就可正确运行了。

结束语

vscode 不得不说插件生态确实厉害,不过文档确实有点老了, 应该提示下安装对应插件的。

原创作者: pqjwyn 转载于: https://www.cnblogs.com/pqjwyn/p/18464395
### 解决 VSCode 插件报错问题 #### 了解 `problemMatcher` 配置错误 `$esbuild-watch` 当遇到类似于 `problemMatcher` 引用无效的问题时,通常是因为配置文件中的设置不正确或工具链版本兼容性问题所致。对于 `$esbuild-watch` 这样的特定标记符来说,确保其被正确定义于构建任务的任务定义部分内至关重要[^1]。 如果是在自定义任务中使用此匹配器,则需确认该模式已按照官方文档说明进行了恰当声明: ```json { "version": "2.0.0", "tasks": [ { "label": "watch with esbuild", "type": "shell", "command": "esbuild app.js --watch", "problemMatcher": ["$esbuild-watch"], "isBackground": true, "group": { "kind": "build", "isDefault": true } } ] } ``` 上述 JSON 片段展示了如何在一个简单的监视任务里指定 `$esbuild-watch` 作为问题匹配器的一部分。 #### 修改终端输出样式辅助调试 为了更好地查看来自不同来源的日志消息并快速定位潜在问题所在位置,可以考虑调整 VSCode 内嵌终端的颜色方案来区分各类日志级别。通过安装 Base16 主题扩展包能够轻松实现这一点[^2]。 这不仅有助于提高阅读体验,还能让用户更容易识别警告、错误等重要信息,从而加快解决问题的速度。 #### 处理 TypeScript 编译环境下的权限不足情况 有时由于操作系统的安全机制限制,可能会阻止某些外部程序执行必要的指令集,进而引发诸如无法获取最新版 TypeScript 编译器版本号之类的异常状况。针对此类情形,可以通过提升 PowerShell 的脚本执行策略至允许远程签名过的脚本被执行的状态来进行修复[^3]。 具体做法如下所示: 1. 使用管理员身份启动 Windows PowerShell; 2. 执行命令 `set-ExecutionPolicy RemoteSigned` 并授权变更请求; 3. 检验当前执行策略是否成功更新为预期状态 (`get-ExecutionPolicy`); 完成以上步骤之后再次尝试调用 `tsc -v` 应不会再遭遇相同类型的障碍,并且可以正常处理 `.ts` 文件的编译工作流。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值