你没听错,终于可以在远程服务器上运行 VS Code

原创
2019/03/10 07:16
阅读数 1.6K

前几天,发现社区里有个叫code-server的项目能在远程服务器上运行 vs code。 心生暗喜,虽然vscode是基于Electron开发的,能使用Node.js运行不是新鲜事,但能在服务器端运行又是一个不小的进步。 如果能顺利推广的话,将是继Vim之后,Linux下的又一编辑神器,而且远不止步于编辑器。万一还能Debug呢,远程IDE不再遥不可及!!!

快速入门

从github提交记录来看,code-server是一个刚开源不久的项目。

其官网https://coder.com提供企业级服务,主要是安全认证和权限方面的服务。

社区还在快速迭代中,相关文档不多。官方推荐是拉取Docker镜像,能更简单的使用。

docker run -p 127.0.0.1:8443:8443 -v "${PWD}:/root/project" codercom/code-server code-server --allow-http --no-auth

出于好奇,下载编译好的版本试用一下,当然是Linux版本

解压可用,查看下帮助选项code-server --help

Start your own self-hosted browser-accessible VS Code

USAGE
  $ server [WORKDIR]

ARGUMENTS
  WORKDIR  [default: /root/code-server] Specify working dir

OPTIONS
  -d, --data-dir=data-dir
  -h, --host=host          [default: 0.0.0.0]
  -o, --open               Open in browser on startup
  -p, --port=port          [default: 8443] Port to bind on
  -v, --version            show CLI version
  --allow-http
  --cert=cert
  --cert-key=cert-key
  --help                   show CLI help
  --no-auth
  --password=password

功能还算完备,默认使用https协议,默认绑定8443端口,提供密码登录。

首次访问或切换项目会加载10M以上的资源文件,所以网络必须要快,不然像我一样得加载半天。

界面按下F11开启全屏后,风格和客户端版本基本一样。

快捷键也和客户端一致,支持命令行终端,开发前端应用是没问题的。

使用WebSocket和浏览器保持连接,颇具webpack风格。多开文件时,用的是子进程,支持插件扩展。

源码浅析

code-server对vscode进行了轻度封装,构建时依赖vscode项目,并在其基础上扩展了自己的模块,主要的看点在chrome模块和ide模块。

chrome模块侧重网络层面,例如websocket通信和友好地调用客户端chrome接口。

import { TcpHost, TcpServer, TcpConnection } from "@coder/app/common/src/app";
import { Event, Emitter } from "@coder/events/src";

export const tcpHost: TcpHost = {
	listen(host: string, port: number): Promise<TcpServer> {
		const socketApi: {
			//省略一万字	
		});
	},
};

ide模块主要处理客户端,键盘,通知消息等本地资源的调用。

export * from "./client";
export * from "./fill/clipboard";
export * from "./fill/notification";
export * from "./retry";
export * from "./upload";

还有ide-api模块,负责向外暴露接口方便二次开发。

export interface EvalHelper { }
interface ActiveEvalEmitter {
	removeAllListeners(event?: string): void;
	emit(event: string, ...args: any[]): void;
	on(event: string, cb: (...args: any[]) => void): void;
}
interface IDisposable {
	dispose(): void;
}
interface Disposer extends IDisposable {
	onDidDispose: (cb: () => void) => void;
}
interface Event<T> {
	(listener: (e: T) => any, thisArgs?: any, disposables?: IDisposable[]): IDisposable;
}
//省略一万字	

总结

综上,code-server作为vscode的强力扩展,未来的潜力值得期待。

个人开发者或是小团队,可以基于开源版本简单定制一下也可以快速应用在自身的开发体系内。

应用场景很多,至少下次去服务器找文件时不只有Vim炫酷的命令行,还能有vscode的简单易用。

个人开发者可以实现真正的云开发。IDE部署在云服务器上,带上超极本办公不是梦想。当然前提是服务器性能足够强劲。

展开阅读全文
加载中

作者的其它热门文章

打赏
1
3 收藏
分享
打赏
0 评论
3 收藏
1
分享
返回顶部
顶部