基于VSCode的虚拟机远程连接方案的配件

发表于 分类于 本文字数： 2.3k

VSCode + Ubuntu Server + SFTP + Tmux

VSCode ssh连接Ubuntu Server

见VSCode配置篇

配置ssh连接和公私钥

Tmux

引用：https://blog.csdn.net/m0_48465029/article/details/147040335

tmux (Terminal Multiplexer) 是一个终端复用器，它允许用户在单个终端窗口中创建多个虚拟终端，每个虚拟终端可以独立运行程序

  1. 会话持久性

tmux最强大的功能之一是会话持久性。当您在服务器上运行长时间任务时（如编译大型项目、运行数据分析脚本或进行系统维护），通常需要保持SSH连接处于活动状态。但网络连接可能会中断，或者您可能需要关闭计算机。使用tmux，您可以：

  • 启动一个tmux会话
  • 在其中运行您的长时间任务
  • 分离会话
  • 关闭终端或断开网络连接
  • 稍后重新连接到同一会话，发现您的任务仍在运行
  1. 多任务处理

tmux允许在单个终端窗口中运行多个相关或不相关的任务，每个任务在自己的面板或窗口中运行。这意味着您可以：

  • 在一个面板中编辑代码
  • 在另一个面板中运行测试
  • 在第三个面板中监控系统资源
  • 所有这些都在同一个屏幕视图中，无需切换窗口

安装

Linux

1
2
sudo apt-get update
sudo apt-get install tmux

嗯…发现是自带的

基本概念

会话 (Session)

会话是tmux的顶层对象，它是一组窗口的集合，加上一些会话范围内的设置和状态信息。会话可以被分离（detached）和重新连接（attached），这是tmux最强大的功能之一。

你可以有多个独立的会话，每个会话用于不同的项目或任务组。例如，你可能会为每个正在进行的开发项目创建一个会话。

窗口 (Window)

窗口类似于传统终端应用程序中的标签页。每个会话可以包含多个窗口，每个窗口占据整个屏幕，可以包含一个或多个面板。窗口由其索引（从0开始）和可选的名称标识。

面板 (Pane)

面板是窗口内的矩形区域，每个面板运行一个独立的shell或程序。您可以水平或垂直分割窗口来创建多个面板，并可以根据需要调整它们的大小或重新排列它们。

前缀键 (Prefix Key)

tmux使用前缀键作为命令的开始。默认前缀键是Ctrl+b（通常写作C-b）。要发送tmux命令，您先按前缀键，然后是命令键。例如，要创建一个新窗口，您按C-b c（按住Ctrl键，按b，松开两个键，然后按c）。

操作

会话管理

新建会话

默认连接：

1
tmux

指定会话名：

1
tmux new -s session-name
分离会话

分离会话：C-b d（保持会话在后台运行）

image-20251208094310305

关闭当前面板：C-b x或输入exit命令（如果这是最后一个面板，会关闭窗口）

连接会话

列出当前所有会话

1
tmux ls

还能看到当前连接的会话是哪个

image-20251208091630502

连接到某个会话

1
tmux attach -t session-name
其他

重命名会话C-b $。下面会出现提示

image-20251208094626439

窗口管理

创建新窗口：C-b c

当前窗口后面会用*标识出来。比如[root] 0:bash* 1:newname!- ，表示当前窗口是root会话里的0:bash

image-20251208094837701

重命名当前窗口：C-b ,

关闭当前窗口：C-b &或在窗口的所有面板中输入exit

列出所有窗口：C-b w

这里还可以切换窗口

image-20251208095010704

查找窗口：C-b f

切换到下一个窗口：C-b n

切换到上一个窗口：C-b p

切换到特定编号的窗口：C-b 0到C-b 9

切换到最后活动的窗口：C-b l（小写L）

这些切换都是在当前会话里发生的

移动当前窗口：C-b .然后输入新的索引号

面板管理

垂直分割当前面板：C-b %

水平分割当前面板：C-b "

image-20251208100039265

切换到下一个面板：C-b o

切换到相应方向的面板：C-b 方向键

显示面板编号并快速切换：C-b q然后按对应的数字键

关闭当前面板：C-b x或输入exit

临时最大化/恢复当前面板：C-b z

下面会显示Z

image-20251208100132293

顺时针旋转面板位置：Ctrl-b Ctrl-o

image-20251208100244378

逆时针旋转面板位置：Ctrl-b Meta/Alt-o

将当前面板移动到新窗口：C-b !

复制模式

https://www.cnblogs.com/ghimi/p/18927693

tmux的特殊的复制模式，允许查看历史输出、搜索内容以及复制文本。

鼠标支持

如果 tmux 配置文件启用了鼠标支持(set -g mouse on)，可以直接通过滚动鼠标进入复制模式（见下面配置）

使用鼠标左键选择内容，（不要松开不然会弹走）Ctrl Shift cv来复制粘贴

image-20251208103626841

命令

（这个还是没明白怎么复制，space和ctrl space都不对，总之我就用鼠标了）

进入复制模式：C-b [

退出复制模式：q或Escape

Emacs 模式命令：

功能 快捷键 说明
向上滚动 ↑ 或 Ctrl+p 向上滚动一行
向下滚动 ↓ 或 Ctrl+n 向下滚动一行
向上翻页 PageUp 或 Ctrl + b 快速向上翻页
向下翻页 PageDown 或 Ctrl + v 或 Space 快速向下翻页
移动到历史开头 Alt+Shift+, 跳转到历史记录开头
移动到历史结束 Alt+shift+. 跳转到历史记录结尾
移动到行首 Ctrl+a 跳转到当前行的开头
移动到行尾 Ctrl+e 跳转到当前行的末尾
查找文本 Ctrl+s 或 Ctrl+r 搜索目标文本，Ctrl+s 向下，Ctrl+r 向上搜索
退出复制模式 Ctrl+g 退出当前模式，返回正常窗口
开始选择内容 Ctrl+Space 设置文本选择的起点
复制选中内容 Enter 确定选择范围并复制内容到 tmux 缓冲区
退出复制模式 Escape 退出复制模式

vi模式命令：

功能 快捷键 说明
向上滚动 ↑ 或 k 向上滚动一行
向下滚动 ↓ 或 j 向下滚动一行
向上翻页 PageUp 或 Ctrl + b 快速向上翻页
向下翻页 PageDown 或 Ctrl + f 快速向下翻页
移动到历史开头 gg 跳转到历史记录开头
移动到历史结束 G 跳转到历史记录结尾
移动到行首 0 或 ^ 跳转到当前行的开头
移动到行尾 $ 跳转到当前行的末尾
查找文本 / 或 ? 搜索目标文本，/ 向下，? 向上
退出复制模式 q 退出当前模式，返回正常窗口
开始选择内容 Space 设置文本选择的起点
复制选中内容 Enter 确定选择范围并复制内容到 tmux 缓冲区
退出复制模式 Escape 退出复制模式

配置

通过配置文件来自定义。默认配置文件位于~/.tmux.conf，如果不存在就建一个

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
# 将前缀键从C-b更改为C-a
unbind C-b
set -g prefix C-a
bind C-a send-prefix

# 提高历史限制
set -g history-limit 10000

# 启用鼠标支持
set -g mouse on

# 使用vi风格的键绑定
setw -g mode-keys vi

# 改善颜色
set -g default-terminal "screen-256color"
set -ag terminal-overrides ",xterm-256color:RGB"

# 重新加载配置文件
bind r source-file ~/.tmux.conf \; display "配置已重新加载！"

# 从1开始为窗口和面板编号（而不是0）
set -g base-index 1
setw -g pane-base-index 1

# 分割窗口的更直观的键绑定
bind | split-window -h
bind - split-window -v
unbind '"'
unbind %

# 更快的窗口切换
bind -n M-Left select-pane -L
bind -n M-Right select-pane -R
bind -n M-Up select-pane -U
bind -n M-Down select-pane -D

# 状态栏自定义
set -g status-bg black
set -g status-fg white
set -g status-interval 60
set -g status-left-length 30
set -g status-left '#[fg=green](#S) '
set -g status-right '#[fg=yellow]#(cut -d " " -f 1-3 /proc/loadavg)#[default] #[fg=white]%H:%M#[default]'

重新加载配置文件

1
tmux source-file ~/.tmux.conf

颜色方面，注意应用之后得新建个窗口看颜色。搜了下发现说用”screen-256color”，用”tmux-256color”的都有。但是只是好看了一点点

image-20251208105709491

TODO

还有些配置，例如下面提到的默认打开tmux终端，自动为项目新连接对应的会话

Tmux 和 VSCode - Persist 终端以提升生产力和利润 - DEV 社区

还有主题配置啥的，以后再说吧

SFTP

实现远程本地文件同步。

参考：https://jishuzhan.net/article/1841013160392265730

安装SPTF扩展

image-20251209162749103

上传到服务器

需要先在本地项目进行SFTP配置（所以是每个项目得配一个感觉好麻烦）

按ctrl shift p，搜索sftp，选择这个config

image-20251209164212921

就会在目录下新建一个sftp.json文件。

  • name：随便起
  • host：远程的ip
  • protocol：默认sftp
  • port：sftp默认22
  • remotePath：需要在远程存在
  • uploadOnSave：保存时自动更新到远程

完成之后选中文件（夹）右键，upload file，上传到远程

image-20251209165122989

下载到本地

选中远程文件，右键有下载

image-20251209163021927