VS Code的替代品：Eclipse Theia
【导语】：也许大家最近在不少地方看到了一篇《eclipse 官宣，干掉 vs code》的文章。
其实这又是在炒 2020 年 3 月的一则冷饭。eclipse 基金会官方就没说“干掉 vs code”，说的是“vs code 的一个真正开源替代品（a true open source alternative to visual studio code）”。
本文就带大家认识一下这个 vs code 的替代品：eclipse theia。
theia 是一个基于 ts 开发的开源 ide 框架，基于它我们可以开发出自己定制化的开发工具，它可以部署到云端使用，也可以打包成桌面应用。
theia 是什么？
eclipse theia 不是一个 ide，而是一个用来开发 ide 的框架。 它是一个可扩展的平台，基于现代 web 技术（typescript、css 和 html）实现，是用于开发成熟的、多语言的云计算和桌面类的理想产品。
在 docker 中运行
使用 docker 来启动一个基于 theia 的 ide 是最简单的了，你只需要确保你当前的系统中安装了 docker 即可。我们可以直接使用它提供的镜像 theiaide/theia 来启动：
# linux, macos, 或者 powershell 的终端 docker run -it --init -p 3000:3000 -v $(pwd):/home/project theiaide/theia:next # windows (cmd.exe) docker run -it --init -p 3000:3000 -v %cd%:/home/project theiaide/theia:next
执行上面的命令后，会自动的去拉取 theiaide/theia:next 的镜像并且在 http://localhost:3000 启动 theia ide，它会使用你当前目录作为工作目录。其中，--init 参数是用来避免死进程问题的。
假设此刻的目录为：/users/jerry/workspace/testbox，在该目录下执行上面的命令，我们来看看结果：
docker run theia image
通过日志我们可以看出，theia ide 已经成功启动并且监听 3000 端口了，我们打开浏览器看一下它的庐山真面目：
result of docker run theia image
有没有很亲切的感觉？
哈哈，是的，它跟 vs code 几乎长得一模一样，不仅如此，它同样支持 vs code 中的插件，所以你可以在 theia 中尽情的“享用” vs code 的插件市场。
我们先来跑一个 helloworld 感受一下这个 ide 的能力：
usage of docker run theia image
构建自己的 ide
如果你不想使用 docker，你完全可以自己构建一个 theia ide。接下来我们就基于 theia，在本地跑起来属于我们自己的 ide。
环境要求
node.js 版本 >= 12.14.1 且 = 1.7.0
创建项目
mkdir my-theia cd my-theia
接着创建 package.json 文件：
{ name: my cool ide, dependencies: { @theia/callhierarchy: next, @theia/file-search: next, @theia/git: next, @theia/markers: next, @theia/messages: next, @theia/mini-browser: next, @theia/navigator: next, @theia/outline-view: next, @theia/plugin-ext-vscode: next, @theia/preferences: next, @theia/preview: next, @theia/search-in-workspace: next, @theia/terminal: next }, devdependencies: { @theia/cli: next } }
通过 package.json 我们看到，其实 theia 也是个 node 的包。dependencies 中有很多依赖，大致可以推测出，theia 的功能是由这些包组合起来的，比如@theia/search-in-workspace 负责搜索模块，@theia/terminal 负责终端模块等；另外，@theia/cli 作为 devdependencies，我们会在构建与运行时用到它的一些命令。
安装依赖
yarn
如果下载依赖缓慢，建议切换镜像源地址。安装成功的结果应该如下：
install theia deps
构建项目
yarn theia build
这个命令主要是用来生成项目代码的，包含源码，webpack 配置文件以及 webpack 打包后的文件。运行成功的结果如下：
theia build
运行 theia ide
直接运行
yarn theia start
就能看到我们的 ide 跑在了 3000 端口：
theia start
我们打开 http://localhost:3000 看看：
usage of local run theia image
也是与 vscode 近乎一致的体验。
封装 npm scripts
在 package.json 中添加：
{ // ..... others scripts: { start: theia start, build: theia build } }
以后我们就可以直接用 yarn xxx 的方式来执行了。至此，我们本地已经成功构建了一个 ide ～
（进阶）安装插件
其实上一步我们已经有了一个 ide 了，但是作为开发工具来说，那可能还差点意思。究竟差点什么呢？我们来写一些代码就知道了：
theia without plugins
是的，一目了然的结果，没有高亮，并且编码的过程中什么提示也没有，也就是相当于一个长得好看的记事本了。这完全不足以称之为一个 ide，下面我们就来安装这些插件，使我们的 ide 强大起来。此时，我们需要更新一下 package.json ：
{ // ... others scripts: { prepare: yarn run clean && yarn build && yarn run download:plugins, clean: theia clean, build: theia build --mode development, start: theia start --plugins=local-dir:plugins, download:plugins: theia download:plugins }, theiapluginsdir: plugins, theiaplugins: { vscode-builtin-css: https://github.com/theia-ide/vscode-builtin-extensions/releases/download/v1.39.1-prel/css-1.39.1-prel.vsix, vscode-builtin-html: https://github.com/theia-ide/vscode-builtin-extensions/releases/download/v1.39.1-prel/html-1.39.1-prel.vsix, vscode-builtin-javascript: https://github.com/theia-ide/vscode-builtin-extensions/releases/download/v1.39.1-prel/javascript-1.39.1-prel.vsix, vscode-builtin-json: https://github.com/theia-ide/vscode-builtin-extensions/releases/download/v1.39.1-prel/json-1.39.1-prel.vsix, vscode-builtin-markdown: https://github.com/theia-ide/vscode-builtin-extensions/releases/download/v1.39.1-prel/markdown-1.39.1-prel.vsix } }
我们更新了 scripts，同时又添加了 theiapluginsdir 和 theiaplugins 这两个属性。theiapluginsdir 是用来设置我们的插件存放地址的，theiaplugins 就是我们要安装的插件了。运行项目之前，我们要先运行 yarn prepare 来准备环境，我们会在日志中看到插件的下载情况：
download plugins
这些插件都会放在当前目录下的 plugins 文件夹下。我们再来启动 ide 看看效果，注意此时 start 带上了参数，指定了插件的目录：
theia with plugins
可以看到，借助于插件，我们可以真正的使用这个 ide 作为生产工具了。
打包桌面应用
这个相对来说就比较容易了，只有简单的几步，我们可以直接参考它的 repo：https://github.com/theia-ide/yangster-electron
总结
通过上面的例子，我们已经可以构建出一个属于自己的 ide 了。如果你有自己的服务器，那么按照上面的步骤搭建一个 cloud ide，以后出门就不用背着电脑啦，一个平板，甚至一台手机就可以在线编程。
华为鸿蒙系统手机计划曝光，为打造系统新生态
A型应急照明配电箱安装规定
直流电路中的理想电阻特性
最新数据：浪潮云位居云计算整体市场排名前五位
新思科技推出全新定制设计解决方案Custom Compiler
VS Code的替代品：Eclipse Theia
蓝牙模块在智能城市中的关键角色
华为发布已eLTE MCCS为核心的集约型平安城市解决方案
TikTok成为2020年下载量最受欢迎的应用程序
采用CMOS技术的频率参考源的特点及应用分析
沃达丰空中通讯公司表示已经实现了整体的5G频段拍卖目标
定氮仪的应用领域有哪些
!销售/收购/维修TDS3034B数字荧光示波器TDS303
Apple与Intel的未来，相爱还是相杀？
了解电解质在负极表面和晶界的反应过程
pcb冲孔冲偏改善
贵阳城管：智慧城市下的“全民参与，人人共治”城管新模式
嵌入式 FPGA (eFPGA) 技术的过去、现在和未来
光伏分布式监控系统：太阳能利用的智能化伴侣
德意志证交所正计划开发一种基于区块链的证券借贷系统
其实这又是在炒 2020 年 3 月的一则冷饭。eclipse 基金会官方就没说“干掉 vs code”，说的是“vs code 的一个真正开源替代品（a true open source alternative to visual studio code）”。
本文就带大家认识一下这个 vs code 的替代品：eclipse theia。
theia 是一个基于 ts 开发的开源 ide 框架，基于它我们可以开发出自己定制化的开发工具，它可以部署到云端使用，也可以打包成桌面应用。
theia 是什么？
eclipse theia 不是一个 ide，而是一个用来开发 ide 的框架。 它是一个可扩展的平台，基于现代 web 技术（typescript、css 和 html）实现，是用于开发成熟的、多语言的云计算和桌面类的理想产品。
在 docker 中运行
使用 docker 来启动一个基于 theia 的 ide 是最简单的了，你只需要确保你当前的系统中安装了 docker 即可。我们可以直接使用它提供的镜像 theiaide/theia 来启动：
# linux, macos, 或者 powershell 的终端 docker run -it --init -p 3000:3000 -v $(pwd):/home/project theiaide/theia:next # windows (cmd.exe) docker run -it --init -p 3000:3000 -v %cd%:/home/project theiaide/theia:next
执行上面的命令后，会自动的去拉取 theiaide/theia:next 的镜像并且在 http://localhost:3000 启动 theia ide，它会使用你当前目录作为工作目录。其中，--init 参数是用来避免死进程问题的。
假设此刻的目录为：/users/jerry/workspace/testbox，在该目录下执行上面的命令，我们来看看结果：
docker run theia image
通过日志我们可以看出，theia ide 已经成功启动并且监听 3000 端口了，我们打开浏览器看一下它的庐山真面目：
result of docker run theia image
有没有很亲切的感觉？
哈哈，是的，它跟 vs code 几乎长得一模一样，不仅如此，它同样支持 vs code 中的插件，所以你可以在 theia 中尽情的“享用” vs code 的插件市场。
我们先来跑一个 helloworld 感受一下这个 ide 的能力：
usage of docker run theia image
构建自己的 ide
如果你不想使用 docker，你完全可以自己构建一个 theia ide。接下来我们就基于 theia，在本地跑起来属于我们自己的 ide。
环境要求
node.js 版本 >= 12.14.1 且 = 1.7.0
创建项目
mkdir my-theia cd my-theia
接着创建 package.json 文件：
{ name: my cool ide, dependencies: { @theia/callhierarchy: next, @theia/file-search: next, @theia/git: next, @theia/markers: next, @theia/messages: next, @theia/mini-browser: next, @theia/navigator: next, @theia/outline-view: next, @theia/plugin-ext-vscode: next, @theia/preferences: next, @theia/preview: next, @theia/search-in-workspace: next, @theia/terminal: next }, devdependencies: { @theia/cli: next } }
通过 package.json 我们看到，其实 theia 也是个 node 的包。dependencies 中有很多依赖，大致可以推测出，theia 的功能是由这些包组合起来的，比如@theia/search-in-workspace 负责搜索模块，@theia/terminal 负责终端模块等；另外，@theia/cli 作为 devdependencies，我们会在构建与运行时用到它的一些命令。
安装依赖
yarn
如果下载依赖缓慢，建议切换镜像源地址。安装成功的结果应该如下：
install theia deps
构建项目
yarn theia build
这个命令主要是用来生成项目代码的，包含源码，webpack 配置文件以及 webpack 打包后的文件。运行成功的结果如下：
theia build
运行 theia ide
直接运行
yarn theia start
就能看到我们的 ide 跑在了 3000 端口：
theia start
我们打开 http://localhost:3000 看看：
usage of local run theia image
也是与 vscode 近乎一致的体验。
封装 npm scripts
在 package.json 中添加：
{ // ..... others scripts: { start: theia start, build: theia build } }
以后我们就可以直接用 yarn xxx 的方式来执行了。至此，我们本地已经成功构建了一个 ide ～
（进阶）安装插件
其实上一步我们已经有了一个 ide 了，但是作为开发工具来说，那可能还差点意思。究竟差点什么呢？我们来写一些代码就知道了：
theia without plugins
是的，一目了然的结果，没有高亮，并且编码的过程中什么提示也没有，也就是相当于一个长得好看的记事本了。这完全不足以称之为一个 ide，下面我们就来安装这些插件，使我们的 ide 强大起来。此时，我们需要更新一下 package.json ：
{ // ... others scripts: { prepare: yarn run clean && yarn build && yarn run download:plugins, clean: theia clean, build: theia build --mode development, start: theia start --plugins=local-dir:plugins, download:plugins: theia download:plugins }, theiapluginsdir: plugins, theiaplugins: { vscode-builtin-css: https://github.com/theia-ide/vscode-builtin-extensions/releases/download/v1.39.1-prel/css-1.39.1-prel.vsix, vscode-builtin-html: https://github.com/theia-ide/vscode-builtin-extensions/releases/download/v1.39.1-prel/html-1.39.1-prel.vsix, vscode-builtin-javascript: https://github.com/theia-ide/vscode-builtin-extensions/releases/download/v1.39.1-prel/javascript-1.39.1-prel.vsix, vscode-builtin-json: https://github.com/theia-ide/vscode-builtin-extensions/releases/download/v1.39.1-prel/json-1.39.1-prel.vsix, vscode-builtin-markdown: https://github.com/theia-ide/vscode-builtin-extensions/releases/download/v1.39.1-prel/markdown-1.39.1-prel.vsix } }
我们更新了 scripts，同时又添加了 theiapluginsdir 和 theiaplugins 这两个属性。theiapluginsdir 是用来设置我们的插件存放地址的，theiaplugins 就是我们要安装的插件了。运行项目之前，我们要先运行 yarn prepare 来准备环境，我们会在日志中看到插件的下载情况：
download plugins
这些插件都会放在当前目录下的 plugins 文件夹下。我们再来启动 ide 看看效果，注意此时 start 带上了参数，指定了插件的目录：
theia with plugins
可以看到，借助于插件，我们可以真正的使用这个 ide 作为生产工具了。
打包桌面应用
这个相对来说就比较容易了，只有简单的几步，我们可以直接参考它的 repo：https://github.com/theia-ide/yangster-electron
总结
通过上面的例子，我们已经可以构建出一个属于自己的 ide 了。如果你有自己的服务器，那么按照上面的步骤搭建一个 cloud ide，以后出门就不用背着电脑啦，一个平板，甚至一台手机就可以在线编程。
华为鸿蒙系统手机计划曝光，为打造系统新生态
A型应急照明配电箱安装规定
直流电路中的理想电阻特性
最新数据：浪潮云位居云计算整体市场排名前五位
新思科技推出全新定制设计解决方案Custom Compiler
VS Code的替代品：Eclipse Theia
蓝牙模块在智能城市中的关键角色
华为发布已eLTE MCCS为核心的集约型平安城市解决方案
TikTok成为2020年下载量最受欢迎的应用程序
采用CMOS技术的频率参考源的特点及应用分析
沃达丰空中通讯公司表示已经实现了整体的5G频段拍卖目标
定氮仪的应用领域有哪些
!销售/收购/维修TDS3034B数字荧光示波器TDS303
Apple与Intel的未来，相爱还是相杀？
了解电解质在负极表面和晶界的反应过程
pcb冲孔冲偏改善
贵阳城管：智慧城市下的“全民参与，人人共治”城管新模式
嵌入式 FPGA (eFPGA) 技术的过去、现在和未来
光伏分布式监控系统：太阳能利用的智能化伴侣
德意志证交所正计划开发一种基于区块链的证券借贷系统