VS Code无原生实时同步功能,可靠做法是用rsync/scp/SSH触发部署;Remote-SSH适合调试但不推荐生产;Syncing插件可配置rsync实现受控同步;tasks.json调用deploy.sh脚本最接近真实发布流程。

VS Code 本身不提供“实时同步代码到服务器”的原生功能,所谓“实时同步”多数是误用概念——真正可靠的做法是用 rsync、scp 或 SSH 配合任务触发(保存/提交/构建),而非监听文件变动后无差别推送到生产环境。盲目启用“保存即上传”极易覆盖线上配置、引发权限错误或部署不一致。
用 Remote-SSH 插件直接编辑远程文件(最简但有风险)
Remote-SSH 是 VS Code 官方插件,它让本地 VS Code 界面直连远程服务器的文件系统,所有编辑操作实际发生在服务端。
- 适合开发调试阶段,避免本地与远程手动同步
- 不推荐用于生产环境:没有版本控制、无构建步骤、无法做前置校验(如 ESLint、TypeScript 编译)
- 必须确保远程服务器已开启
sshd,且用户有对应目录写入权限;若用sudo权限编辑,需提前配置免密sudoers,否则保存失败 - 编辑
/etc/nginx/conf.d/app.conf这类系统路径时,VS Code 会提示“Permission denied”,此时不能靠插件解决,得先改文件属主或用 root 登录
用 Syncing 插件 + 自定义 rsync 命令实现受控同步
Syncing(非官方,作者:yaozeyuan)支持配置 rsync 命令,在保存时执行同步,比“实时监听”更可控。
- 在
.vscode/settings.json中配置:"syncing.rsyncCommand": "rsync -avz --delete --exclude='.git' --exclude='node_modules' ${workspaceFolder}/ user@host:/path/to/deploy/" -
--delete表示远程删除本地不存在的文件,慎用;上线前务必确认排除项(如.env、config.local.php)已加入--exclude - 该插件不会自动处理 SSH 密钥密码;若使用密码登录,需提前运行
ssh-agent并ssh-add,否则每次保存都卡在密码输入 - Windows 用户注意:WSL 下可用,但原生 Windows 版 VS Code 默认无
rsync,需安装cygwin或改用robocopy(不推荐,兼容性差)
用 tasks.json 触发部署脚本(推荐用于 CI/CD 衔接)
把部署逻辑从插件中解耦出来,写成独立脚本(如 deploy.sh),再通过 VS Code 的 tasks.json 绑定快捷键或保存后运行。
- 在
.vscode/tasks.json中定义:{ "version": "2.0.0", "tasks": [{ "label": "deploy", "type": "shell", "command": "./deploy.sh", "group": "build", "presentation": { "echo": true, "reveal": "always" } }] } -
deploy.sh可包含 git pull、npm install、pm2 reload、nginx -t && systemctl reload nginx 等完整流程,比单纯 rsync 更接近真实发布场景 - 配合
files.associations和editor.codeActionsOnSave,可做到“保存 TypeScript 后自动编译 + 运行 deploy 任务”,但要注意:TypeScript 编译失败时,deploy 不应继续 - 这个方案不依赖任何第三方插件,升级 VS Code 或更换机器时,只需复制
.vscode/目录即可复用
真正难的不是“怎么传上去”,而是“传什么、何时传、传完怎么验证”。比如前端项目传了 dist/ 却忘了清空旧缓存,或者后端传了新代码但没 reload 进程——这些都不是插件能兜底的事。自动化部署的边界,永远由你的发布流程定义,而不是由 VS Code 插件决定。










