Termux+code-server实现随身全功能VSCode

防杠声明：本文基本无技术含量，仅作操作整理和记录以便查阅。

“把大象放进冰箱需要三步：

1. 打开冰箱，
2. 把大象放进去，
3. 关上冰箱。”

类似地，可以有本文的一句话版本：

1. 在安卓手机上安装Termux，
2. 在Termux上安装code-server，
3. 利用iPad上的ServerEditer连接code-server。

前言

iPad具有便携的优势，同时相对较大的屏幕也使得许多人希望能够发掘它的生产力——

例如在iPad上编程。

然而传闻中的Xcode至今仍未登陆iPad，Swift Playgroud更像一个玩具，而其他编辑器要么只能编辑无法运行，要么只支持某种特定语言。

相对出色的一款是Koder，只是没有终端；另一款Code APP太贵而且终端体验仍然不完整。

总而言之，单单依靠iPad难以得到桌面级的开发体验。

然而，code-server+Termux的组合，使得只用借助一台不难得到的安卓手机即可在iPad上使用完整的VSCode进行编程。

需要强调的是，即使如此，这个方案也无法进行复杂或大规模工程的开发，其面向对象应为有轻量编程需求的大学生、编程初学者或者迫不得已临时需要查看和修改代码的开发人员。

接下来将是详细操作步骤。

条件

硬件

• 一部安卓手机 （和足够的存储空间），用于运行服务端code-server
• 一台iPad，用于显示界面和编辑代码
• 蓝牙键盘（可选但推荐）

code-server也可部署在云服务器，这里选择手机的原因是更方便文件传输和访问，同时局域网延迟更低，并且不依赖外部网络。最关键的一点是免费。

也许有人会问是否可以使用安卓平板。事实上，code-server支持任何运行浏览器的设备，但是安卓平板上不难找到支持原生多语言编辑和本地运行的编辑器，甚至可以安装带图形界面的Linux发行版，也就不必如此折腾了。

软件

• Termux：在安卓系统上提供一个几乎完整的终端环境，且无需Root
• code-server ：服务端程序，客户机连接后可在浏览器中使用VSCode
• ServerEditer：iPadOS原生APP用于访问code-server
• 局域网环境（连接到同一个路由器或者手机热点共享）

知识

• 虽然照葫芦画瓢也能实现最终效果，但是掌握基本的linux终端常识与使用会在遇到问题时有很大帮助

第一步：安装Termux

详细的保姆级教程可见另一篇Termux安装与配置。

太长不看版：

1. 下载F-DroidAPP
2. 在F-Droid中下载安装Termux，或者直接从F-Droid网页下载Termux
3. 在F-droid下载安装Termux:API、Termux:Widget，其他插件可选
4. 打开Termux
5. 允许文件权限：执行termux-setup-storge，并允许权限，以便访问手机上的代码等
6. 更换镜像源：执行termux-change-repo，出现界面后按回车-用方向键选择Tsighua镜像-按空格选中-按回车OK
7. 升级软件仓库：执行pkg upgrade
8. 安装API辅助软件包：执行pkg install termux-api，否则API插件不能正常使用

保持后台运行

在安装完成Termux之后，请进行如下操作：

• 在设置中关闭其电源自动管理（即改为手动管理）
• 允许Termux后台运行和自动启动
• 在切换APP的视图将Termux下拉至产生小锁标志以避免被清理
• 在手机管家和各种清理加速APP添加白名单
• 每次运行时在通知栏点击Acquire Wakelock，或者终端执行termux-wake-lock

主要原则是尽可能给予Termux后台权限，否则后面可能出现手机熄屏时iPad就断连无法操作的问题。

如果实在解决不了，也可以使用各种可以一键屏幕常亮的辅助类APP。

第二步：在Termux上安装与配置Code-Server

安装

推荐按照code-server在Termux上的官方安装指南安装。

20230502更新：现在只需三行命令即可安装和启动code-server，不用像以前一样手动安装依赖和从yarn构建了。

注意： 安装中仍然需要从github下载文件，建议使用魔法上网，或者多尝试几次。

1
2
3

pkg install tur-repo
pkg install code-server
code-server

配置

code-server通过配置文件指定各种功能设置。刚安装完时还不会生成配置文件，需要先执行一次code-server。正常运行的输出信息如下图：

此时还无需急着用iPad连接。

按Ctrl+C终止程序，此时在~/.config/code-server/config.yaml这个文件中就有了初始化的配置信息。使用nano（nano ~/.config/code-server/config.yaml）或者其他你熟悉的命令行文本编辑器打开即可修改。

需要修改的有：

• bind-addr字段，将IP设定为0.0.0.0以使得局域网内都可以访问，并选择一个合适的端口
• password字段：设置一个容易记住的密码。

例如我的配置文件如下所示：

1
2
3
4

bind-addr: 0.0.0.0:9090                 #code-server绑定的地址和端口
auth: password							#验证方式，可选password或none
password: passwordForCodeServer         #设置密码
cert: false                             

此时再运行code-server，就可以在局域网内以设定的密码访问了。但是首先还需要知道手机在局域网内的IP地址。可以使用如下命令组合，其原理是在ip命令的输出中用正则表达式查找符合IP地址格式的字符串并显示：

1

ip address show|grep -e 'inet [0-9]*\.[0-9]*\.[0-9]*\.[0-9]*' -o |grep -e '[0-9]*\.[0-9]*\.[0-9]*\.[0-9]*' -o 

此时将会输出所有本机的IPv4地址，其中127.0.0.1是本地回环地址，一般局域网地址的格式为192.168.x.y。其中x和y为0~255的数字。

如果你所在的局域网是校园网或公司内网等，这个地址也有可能不符合上述格式。只要保证手机和iPad在同一局域网下即可。

（可选）启用HTTPS

如果对安全性有要求，建议参考code-server官方文档启用HTTPS。

（可选）迁移桌面VSCode配置和扩展（extensions）

如果没有特别的需求，直接在扩展选项卡按正常方式添加扩展也是可以的。但是code-server不支持登录账户，也就无法通过账户同步扩展。但是可以直接通过复制扩展文件的方式将桌面已经安装的扩展直接迁移。

不同系统的vscode插件安装目录：

将桌面版的扩展直接以各种方式复制到code-server的扩展目录即可。（例如先打包发送到手机，然后在termux中访问并解压）

注意：code-server基于开源版本的vscode(codium)，所以部分微软官方的扩展可能不可用。

解决无法搜索

由于Termux预装的软件包较少，缺乏vscode搜索功能需要的rg命令，直接运行code-server会造成在文件中搜索时报错。解决方法如下：

1
2
3

pkg install ripgrep
cd ~/.config/yarn/global/node_modules/code-server
ln -s $PREFIX/bin/rg ./lib/vscode/node_modules/vscode-ripgrep/bin/rg

测试

在同一局域网内的iPad上打开浏览器，输入http://a.b.c.d:yyyy，其中abcd是刚刚获得的手机在局域网的IP地址，yyyy是你在配置文件中设置的端口。正常情况会出现如下界面：

如果输入设置的密码后VSCode的界面出现，那么表明测试成功。但是我们之后将不直接用浏览器访问，而是使用更加方便的ServerEditer。

第三步：使用ServerEditer连接Code-Server

code-server用浏览器即可访问，而serverediter可以实现自动登录。对于自己搭建的code-server服务器（Self-Hosted Server），ServerEditer是免费的。

设置步骤

1. 从APP Store中安装ServerEditer
2. 打开APP，点击左上角的( i )
3. 选择Self-Hosted Server
4. 填入URL（包括IP和端口）和密码
5. 点击Save和5. Done

之后页面会自动刷新和登录，然后就会显示VSCode的界面，操作与桌面版完全相同。

由于界面是在iPad本地绘制的，code-server只对文件读写、命令运行等操作进行传输，所以日常操作除了打开大文件时几乎不会感觉到卡顿。

（可选）字体问题

既然界面在iPad端绘制，编辑器中可以设置的字体就是iPad上安装的字体。如果终端安装了Zsh和Powerlevel10k等美化主题，为了终端效果的正常显示还需要在iPad上安装powerline字体。

1. 可以从powerline字体仓库下载Powerline字体
2. 使用ifont等字体管理APP安装字体
3. 在VSCode中设置字体为安装的字体（全称，例如Meslo LG S DZ Regular）
4. 重启VSCode中的终端窗口

最终效果如下图所示：

第四步：打开代码文件开始编程

在之前安装Termux时，我们 已经执行了termux-setup-storge并给予了文件访问权限。此时在Termux的用户home目录（启动默认目录，可使用cd ~来切换到该目录）下会出现storge文件夹，其中包括dcim、downloads、movies、music、pictures、shared等文件夹，分别对应手机存储中的相应文件夹。

其中shared文件夹最为特殊，进入后可以看到手机内置存储中的所有文件。

之所以这些文件夹看起来违反了文件目录的树形结构，是因为它们（包括 ~/storage）都使用了符号链接。

在iPad上连接后，可以直接使用VSCode中的“打开文件/打开文件夹”功能定位到上述目录选择文件并打开，而后就可以开始编辑代码。

注意：在serverediter的右上角提供了upload按钮，但是它对于文件的上传和下载支持更多体现在使用软件方提供的付费云服务器时。 对于我们自行搭建的code-server服务，上传和下载并不可用。因此最好将代码文件存放在安卓手机上进行使用，或者通过其他方式进行文件传输。

（可选）第五步：使用Termux:Widget从桌面一键开启code-server

每次都要打开终端并输入命令还是有点麻烦，虽然旁人看起来确实比较炫酷。

Termux提供了桌面部件，方便快速调用脚本。设置步骤如下：

1. 确认Termux:Widget插件APP已安装

2. 在安卓手机桌面放置Termux桌面部件

3. 依次执行：

   1 2 3 4 5 6 7 8 9 10

   # Termux指定该目录用于存放显示在桌面的脚本 mkdir -p ~/.shortcuts/tasks # /bin/code-server实际上是js脚本文件，需要修复shebang termux-fix-shebang $PREFIX/bin/code-server # 进入目录并创建脚本文件 cd ~/.shortcuts/tasks nano run-code-server.sh （输入运行code-server的脚本内容） # 给予可执行权限 chmod +x run-code-server.sh

   其中code-server的shebang问题同样可以见Termux安装与配置。

4. 回到桌面，点击部件右上角的刷新，就可以看到脚本列表

5. 点击即可运行

我的脚本内容如下所示：

1
2
3
4
5
6
7

#!/data/data/com.termux/files/usr/bin/bash   
#in case one is already running     
killall node
termux-wake-lock 
ip address show|grep -e 'inet [0-9]*\.[0-9]*\.[0-9]*\.[0-9]*' -o |grep -e '[0-9]*\.[0-9]*\.[0-9]*\.[0-9]*' -o |termux-notification -t 'code-server is running' --priority high --ongoing --button1 exit --button1-action "killall node;termux-toast 'code-server stopped';termux-notification-remove 0;termux-wake-unlock;exit" -i 0 --vibrate 250
#running code-server:
code-server

首先需要注意第一行的shebang，在Termux上与常见的linux脚本不同；

第二行是杀死正在运行的进程，防止多次误操作；

第三行是利用TermuxAPI中的通知API在通知栏显示一个通知，通知内容是当前可用的IP地址，以便iPad端连接；通知展开后可以显示一个按钮用于手动结束进程。（因为tasks下的脚本只在后台运行，无法通过Ctrl+C结束）

如下图所示：

注意：结束进程时这里为了方便直接结束了所有node的进程，如果有其他需要运行的依赖node的程序需要修改这部分脚本。

小结

Termux强大的功能赋予了安卓手机更多的可玩性，也使得本文的目标——在iPad上使用VSCode成为可能。但是Termux与普通linux 终端的细微区别，也是本文中许多细节和踩坑的关键所在。

本文的技术含量不高，按步骤依次执行即可完成。但是认真阅读官方文档、仔细思考每一步的作用和上下文，是入门学习各种技术的重要技能。