vscode无内置file watcher,需通过扩展(如auto run command)或外部工具(如chokidar-cli)实现保存/修改即执行命令;前者响应编辑事件,后者监听文件系统变更,wsl/docker环境需启用实验性监听器或改用remote-wsl。

VSCode 本身没有内置 File Watcher 功能
很多人搜“VSCode 文件监听器”,默认以为像 WebStorm 那样开箱即用,其实 VSCode 原生不提供「保存/修改即执行任意命令」的独立功能。它只做两件事:监听文件变更(用于提示重载)、运行任务(需手动触发或后台常驻)。真正的“变动 → 执行命令”必须靠外部工具或扩展补足。
用 Auto Run Command 扩展实现保存即运行
这是最轻量、最贴近需求的方案,适合保存时格式化、检查、生成文档等单次操作场景。
- 安装扩展
Auto Run Command(作者: Shan Khan) - 在
settings.json中添加规则,例如保存.ts文件时跑 ESLint 修复:
"autoRunCommand.rules": [
{
"command": "eslint --fix ${file}",
"match": "\.ts$",
"runIn": "terminal"
}
]
-
runIn: "terminal"表示在集成终端中执行;设为"none"则静默运行(适合 CLI 工具无输出的场景) - 注意:该扩展监听的是
onDidSaveTextDocument事件,不是文件系统级变更,所以 Git checkout 或脚本写入不会触发
用 chokidar-cli + Tasks 实现真正的文件系统监听
当你要响应 任何来源 的文件改动(比如构建脚本输出 CSS、Python 脚本生成 JSON),就得绕过 VSCode 的编辑事件,走底层文件系统监听。
- 先装工具:
npm install -D chokidar-cli - 在
package.json里加 script:
"scripts": {
"watch:api": "chokidar 'src/api/**/*.ts' -c 'npm run build:api'"
}
- 再在
.vscode/tasks.json中包装成任务(便于快捷键调用):
{
"version": "2.0.0",
"tasks": [{
"label": "Watch API files",
"type": "shell",
"command": "npm run watch:api",
"isBackground": true,
"problemMatcher": []
}]
}
- 运行后,
chokidar会持续监听,VSCode 只负责托管终端进程——这意味着即使你切到别的窗口,监听仍在工作 - ⚠️ 常见坑:
chokidar默认递归监听子目录,若没配files.watcherExclude,可能和 VSCode 自身监听冲突,导致 CPU 升高或重复触发
WSL / Docker 环境下监听失效怎么办
在 WSL2 或 Docker Desktop 挂载卷中,VSCode Windows 版直接监听 \wsl$ 路径几乎必失败——这不是配置问题,是 Windows 文件系统 API 对 Linux inotify 事件的翻译丢失。
- 不要在 Windows 端打开
\wsl$Ubuntuproject,改用 Remote - WSL 扩展,在 WSL 内启动 VSCode - 如果必须用 Windows 版 VSCode,临时启用实验性监听器:
"files.useExperimentalFileWatcher": true,并确保"files.watcherInclude"显式包含你要监听的路径(如"**/*.ts"),否则 glob 过滤会静默丢掉事件 - Docker 场景下,优先把监听逻辑放进容器内(比如
nodemon或watchexec),VSCode 只负责连接终端
真正难处理的不是“怎么配”,而是搞清触发源:是编辑器保存?Git 切换分支?还是构建脚本写入?不同源头对应完全不同的监听层级和工具选型。











