10分钟上手electerm分屏操作：运维工程师的服务器管理效率倍增指南
10分钟上手electerm分屏操作：运维工程师的服务器管理效率倍增指南
【免费下载链接】electerm 📻Terminal/ssh/telnet/serialport/sftp client(linux, mac, win) 
项目地址: https://gitcode.com/gh_mirrors/el/electerm
作为运维工程师，你是否还在为同时管理多台服务器而频繁切换窗口？是否因操作分散导致工作效率低下？electerm的分屏功能将彻底改变你的工作方式。本文将带你掌握分屏操作的全部技巧，让你轻松应对多服务器管理场景，效率提升300%。
分屏功能核心价值
electerm作为一款强大的终端工具（Terminal/ssh/telnet/serialport/sftp client），其分屏功能由src/client/components/layout/layout.jsx模块提供核心支持。通过灵活的屏幕分割，你可以：
- 同时监控多台服务器的实时状态
- 快速在不同服务器间复制粘贴命令和数据
- 对比分析多服务器的运行日志
- 执行批量操作时实时观察各服务器响应
分屏布局类型全解析
electerm提供了8种预设分屏布局，满足不同场景需求：
基础分屏模式
- 单列布局：默认布局，适合单任务操作
- 双列布局：将窗口平均分为左右两部分
- 三列布局：将窗口平均分为左中右三部分
- 双行布局：将窗口平均分为上下两部分
- 三行布局：将窗口平均分为上中下三部分
高级组合布局
- 2x2网格布局：分为上下左右四个均等区域
- 右侧双行布局：左侧一个主区域，右侧分为上下两个区域
- 底部双列布局：上方一个主区域，下方分为左右两个区域
这些布局由src/client/components/layout/layout-alg.js中的算法控制，例如双列布局的实现代码：
const layoutTwoColumns = (w, h) => ({
wrapStyles: [
{
left: 0,
top: 0,
bottom: 0,
right: (w / 2 - 2) + 'px'
},
{
left: (w / 2 + 2) + 'px',
top: 0,
bottom: 0,
right: 0
}
],
handleStyles: [
{
left: (w / 2 - 2) + 'px',
top: 0,
bottom: 0
}
]
})
快速上手：分屏操作三步法
步骤一：打开分屏布局选择器
有两种方式可以打开分屏布局选择器：
- 菜单栏方式：点击顶部菜单栏的"视图" -> "分屏布局"
- 快捷键方式：按下
Alt+L组合键快速调出布局选择面板
步骤二：选择合适的分屏布局
在布局选择面板中，你可以预览并选择适合当前任务的布局类型。对于同时管理10台服务器的场景，推荐使用以下两种布局组合：
- 三列布局+双行布局：先使用三列布局，然后在每个列中使用双行布局，总共可形成6个工作区
- 2x2网格布局+嵌套分屏：先创建2x2网格（4个区域），然后在需要的区域继续分屏
步骤三：分配服务器连接
创建分屏后，你可以：
- 在每个分屏区域打开新的服务器连接
- 将已打开的标签页拖动到不同分屏区域
- 使用右键菜单将当前连接"移动到"指定分屏
高级操作技巧
动态调整分屏大小
分屏之间的分隔线可以拖动调整，具体操作：
- 将鼠标悬停在分屏分隔线上，光标会变为双向箭头
- 按住鼠标左键拖动，调整分屏比例
- 释放鼠标完成调整
此功能由src/client/components/layout/layout.jsx中的calcLayoutStyle函数处理窗口大小计算：
const calcLayoutStyle = () => {
const {
width,
height,
pinnedQuickCommandBar,
leftSidebarWidth,
pinned,
rightPanelVisible,
rightPanelPinned,
rightPanelWidth,
resizeTrigger,
inActiveTerminal
} = props.store
const h = height - footerHeight - (inActiveTerminal && pinnedQuickCommandBar ? quickCommandBoxHeight : 0) + resizeTrigger
const l = pinned ? 43 + leftSidebarWidth : 43
const r = rightPanelVisible && rightPanelPinned ? rightPanelWidth : 0
return {
height: h,
top: 0,
left: l,
width: width - l - r
}
}
分屏快捷键大全
掌握这些快捷键，操作效率翻倍：
| 操作 | Windows/Linux快捷键 | Mac快捷键 |
|---|---|---|
| 打开布局选择器 | Alt+L | Option+L |
| 切换到单列布局 | Alt+1 | Option+1 |
| 切换到双列布局 | Alt+2 | Option+2 |
| 切换到三列布局 | Alt+3 | Option+3 |
| 切换到双行布局 | Alt+4 | Option+4 |
| 切换到2x2网格布局 | Alt+5 | Option+5 |
| 关闭当前分屏 | Ctrl+W | Command+W |
| 分屏间切换 | Ctrl+Tab | Command+Tab |
分屏批量操作
当你需要在多个分屏中执行相同命令时，可以使用electerm的批量输入功能：
- 点击底部状态栏的"批量输入"按钮
- 在弹出的输入框中输入要执行的命令
- 选择需要应用命令的分屏（默认全部选中）
- 点击"发送"，命令将同时在所选分屏中执行
此功能由src/client/components/footer/batch-input.jsx实现，特别适合服务器集群的统一配置和更新。
多服务器管理实战案例
案例一：电商平台运维监控
使用2x2网格布局同时监控：
- 前端服务器集群（左侧上下两个分屏）
- 数据库服务器（右侧上部分屏）
- 缓存服务器（右侧下部分屏）
通过这种布局，你可以实时观察用户请求从前端到后端的完整链路状态。
案例二：服务器部署与迁移
采用右侧双行布局：
- 左侧主区域：执行部署/迁移脚本
- 右侧上部分屏：源服务器状态监控
- 右侧下部分屏：目标服务器状态监控
这种布局让你在执行关键操作时，能同时关注源和目标系统的状态变化。
分屏操作常见问题解决
问题一：分屏后终端显示异常
如果分屏后终端出现字符重叠或显示不完整，可尝试：
- 在问题分屏区域右键点击
- 选择"刷新终端"
- 如仍有问题，选择"调整终端大小"
问题二：分屏布局无法保存
electerm会自动保存你的分屏布局设置，由src/app/lib/window-control.js中的getWindowSize函数负责：
exports.getWindowSize = async () => {
const rect = await exports.getWindowSizeDep()
if (!isLinux) {
return rect
}
const {
width,
height
} = exports.getScreenSize()
if (rect.width >= width - 200) {
rect.width = width - 200
rect.x = 100
}
if (rect.height >= height - 200) {
rect.height = height - 200
rect.y = 100
}
return rect
}
如果布局无法保存，可尝试删除配置文件后重启：
- Windows:
%APPDATA%electermconfig.json - Mac:
~/Library/Application Support/electerm/config.json - Linux:
~/.config/electerm/config.json
问题三：快捷键冲突
如果分屏快捷键与其他应用冲突：
- 打开设置（快捷键
Ctrl+,或Command+,） - 选择"键盘快捷键"选项卡
- 在"分屏操作"类别下，重新设置冲突的快捷键
总结与进阶
通过本文介绍的分屏操作技巧，你已经能够高效管理多台服务器。要进一步提升效率，建议：
- 熟悉分屏快捷键，减少鼠标操作
- 根据日常工作场景，定制自己的分屏布局方案
- 结合electerm的标签页管理功能，组织不同项目的服务器连接
- 探索分屏与批量操作、脚本功能的组合应用
electerm的分屏功能不仅是窗口的简单分割，更是一种高效的工作流程组织方式。掌握它，让你的服务器管理工作事半功倍！
官方文档：README.md 布局功能源码：src/client/components/layout/ 快捷键设置：src/app/lib/key-bind.js
【免费下载链接】electerm 📻Terminal/ssh/telnet/serialport/sftp client(linux, mac, win) 项目地址: https://gitcode.com/gh_mirrors/el/electerm
