WebStorm Deployment 实战:一键实时同步到腾讯云 ECS

WebStorm Deployment 实战:一键实时同步到腾讯云 ECS

关键词:WebStorm | SFTP | 腾讯云 | 实时同步 | 自动上传


1. 场景痛点

  • 本地开发 Node.js,手动 scp/rsync 麻烦
  • 保存 → 上传 → SSH → 重启 流程重复
  • 想要 「写几行代码立刻看效果」

2. 最终效果

操作 结果
Cmd + S 自动增量上传到 ECS /home/nodejs/<项目名>
右键项目根 一次性全量上传
配置 Exclude node_modules 等被永久忽略

3. 架构交互图

WebStorm macOS 腾讯云ECS:22 监听文件保存事件 SFTP(SSH 22) 增量上传 PM2 / node 重启(可选) 浏览器刷新即见效 WebStorm macOS 腾讯云ECS:22


4. 前置准备(一次性)

步骤 命令/操作 说明
① 创建密钥对 腾讯云控制台 → 密钥 → 新建 务必保存 .pem
② 绑定密钥 关机 → 绑定密钥 → 开机 仅首次
③ 修改权限 chmod 400 xxx.pem macOS 强制要求
④ 创建远程目录 mkdir -p /home/nodejs 项目落盘位置

5. WebStorm 配置总览(图文)

5.1 添加 SFTP 连接

复制代码
Settings → Build, Execution, Deployment → Deployment → +
Type: SFTP
SSH configuration: <create>
字段 示例值
Host 124.xxx.216.48
User root(CentOS)或 ubuntu
Auth Key pair → 选择 xxx.pem
Port 22

▶ 点击 Test Connection 显示 Successfully connected


5.2 映射关系(核心)

配置项 实际远程路径
Root path /home 基准目录
Deployment path ./nodejs/<项目名> 相对基准
Local path /Users/eric/Projects/<项目名> 本地根

拼接结果:/home/nodejs/<项目名>/...


5.3 流程图:上传逻辑

是 否 文件被保存 Automatic Upload 已开启? 计算相对路径 SFTP 上传至 Root+Deployment 等待手动 Upload 远程文件刷新


6. 常用操作速查

需求 入口
首次全量 右键项目根 → Deployment → Upload to ...
增量自动 Tools → Deployment → Automatic Upload (always)
排除目录 Settings → Deployment → Excluded Paths+
对比差异 Tools → Deployment → Compare with Deployed ...
下载远程 Tools → Deployment → Download from ...

7. 典型排除清单

复制代码
node_modules
.git
*.log
dist
build
.env
.vscode
.idea

8. 故障速解

现象 原因 解决
Permission denied 私钥权限过大 chmod 400 key.pem
A SFTP host is not specified 未选 SSH configuration 点击 <create> 新建并测试
上传后路径多一层 /root Root path 写成 /root 改成 /home 或目标基准
只传了单个文件 当前焦点是单文件 右键项目根再 Upload

9. 一键脚本(可选)

.zshrc 里加个别名,保存后顺手重启服务:

bash 复制代码
alias runnode='ssh -i ~/.ssh/xxx.pem root@124.xxx.216.48 "cd /home/nodejs/<项目名> && pm2 restart app"'

本地改完代码 Cmd+S → 终端 runnode → 浏览器刷新即可。


10. 结语

配置一次,终身"保存即部署 "。

把 Deployment 玩熟后,你也可以无缝切换到 VS Code SSHJetBrains Gateway ,但思路完全一致:「让工具替你搬运代码」


🎉 Happy Coding & 永不手动 SCP!


以我之思,借AI之力!

相关推荐
Eagsen CEO4 小时前
如何让 Gemini 在 Android Studio 中顺利工作
android·ide·android studio
sdhongjun5 小时前
VSCode vim Normal模式下无法输入中文到指令参数
ide·vscode·vim
nvvas6 小时前
IDEA安装并且使用Roo Code工具
java·ide·人工智能
OxyTheCrack8 小时前
VSCode使用SSH连接VMware虚拟机环境操作指南
ide·vscode·ssh
AI浩8 小时前
第 5 章:集成开发环境 (IDE) 协作 —— 终端与编辑器的双剑合璧
ide·人工智能·编辑器
日出等日落8 小时前
用 Kavita实现我的远程数字书屋搭建记!
java·开发语言·ide·vscode·编辑器
gaize12138 小时前
腾讯云 CVM 高性价比款
云计算·腾讯云
一见9 小时前
vscode等的“Go Team at Google”插件
ide·vscode·golang
腾讯云大数据9 小时前
存算分离,性能跃升:盖雅工场TCHouse-D 3.0升级实现查询效率再提升60%
大数据·腾讯云
IT大师兄吖10 小时前
faster-whisper 音频转字幕 懒人整合包
ide·macos·xcode