开源Web代码编辑器

创建日期: 2025-02-06 15:41 | 作者: 风波 | 浏览次数: 18 | 分类: 前端

来源：https://www.51cto.com/article/781697.html

来源：https://gitcode.csdn.net/65ec4d221a836825ed7975b9.html

Monaco Editor

https://github.com/microsoft/monaco-editor Monaco编辑器是微软开发的基于Web的代码编辑器，由VS Code提供功能支持 优点： - 具有语法突出显示、代码完成和调试功能的丰富功能集。 - 高度可定制和可扩展。 - 性能出色，即使是大型代码库。 - 支持多种编程语言。 - 与其他工具和框架的集成。

缺点： - 与更简单的代码编辑器相比，学习曲线更陡峭。 - 由于其功能丰富的性质，需要更多的资源来运行。 - 有限的离线功能，因为它主要在网络环境中运行。

OpenVSCode Server

https://github.com/gitpod-io/openvscode-server

这个项目提供了一个可以在远处服务器上运行的VS Code，允许通过Web浏览器进行访问。

它基于Gitpod和GitHub Codespaces的技术架构。VS Code团队对其架构进行重构，以支持基于浏览器的工作模式，并且该项目共享了使用最新版本的VS Code所需的最小更改集，具有简单的升级路径和低维护工作量。

ecode

https://github.com/SpartanJ/ecode

ecode是为现代硬件设计的轻量级代码编辑器，专注于响应性和性能。它利用硬件加速的eepp GUI，并改进eepp GUI库。

功能特征：

Code Server

https://github.com/coder/code-server

Code-Server是一个支持在浏览器中运行VS Code的开源项目，能够在任何设备上提供一致的开发环境。它还支持使用云服务器以获得更快的执行效率，并为移动的用户保留电池寿命。

Tabby

https://github.com/TabbyML/tabby

Tabby是一个可以私有化部署的AI编码助手，提供了GitHub Copilot的开源和本地部署方案。它是独立的，不需要DBMS或云服务，具有易于集成的OpenAPI接口，并支持消费级GPU。

另外，Tabby可以使用Docker轻松安装。

Neko Code Editor

https://github.com/flyingcatdeveloper/nce

Neko Code Editor是一个简单的代码编辑器，具有Monaco Editor类似的功能，包括：控制台、在新选项卡中打开代码、多文件功能、项目管理、DevLog更新、本地数据保存、可自定义设置等功能。

功能特征：

CodeMirror

https://github.com/codemirror/dev/

https://codemirror.net/

CodeMirror是一个可扩展的Web代码编辑器组件，可用于实现具有高级编辑功能和丰富编程接口的文本输入，并支持进行进一步扩展。

功能特征：

CodeFlask

https://github.com/kazzkiq/CodeFlask

CodeFlask是一个轻量级、可定制的基于Web的代码编辑器。它提供了一些基础的代码编辑功能，如：语法突出显示、自动完成和代码格式化。CodeFlask的设计目标为易于使用，可以被轻松地集成到Web应用程序中。当需要一个简单和轻量级的代码编辑器时，它是一个合适的选择。

CodeJar

https://github.com/antonmedv/codejar

CodeJar是一个强大的开源、可嵌入的Web代码编辑器。

功能特征：

Rustpad

https://github.com/ekzhang/rustpad

Rustpad是一个基于操作转换算法的高效和最小的开源协作文本编辑器。只需要一个小的Docker镜像，并且不需要数据库。服务器是使用Rust编写的warp web服务器框架，而前端是使用TypeScript编写的React和Monaco接口。

编辑器通过WebSocket与服务器进行通信，性能高效，但在服务器重新启动或24小时不活动后可能断开连接，导致临时文档丢失。

ICEcoder

https://github.com/icecoder/ICEcoder

ICEcoder是一个基于浏览器的代码编辑器，允许高效的网站开发和维护。它可以在线或离线使用，并与Linux，Windows和Mac平台兼容。唯一的要求是PHP 7（推荐使用7.4）。

但需要注意的是，目前这个开源库已经停止更新。

Playcode

Playcode 只是一个简单的工具，用于快速构建原型和查看编码结果。该工具具有典型的三窗口布局: 代码编辑器、控制台和结果视图。该产品有一个基本的文件结构，但没有版本控制和其他 IDE 特性。

它只支持 Javascript，HTML 和 CSS。还有一个选项可以选择编辑器样式、字体大小和其他文本编辑功能。

Stackblitz

Stackblitz 与完整的 IDE 非常相似，该工具是基于 VS 代码构建的。该产品具有广泛的特性，可以启动并继续开发完整的全堆栈应用程序。该工具由许多开发人员所熟悉的 Visual Studio Code 提供支持。

它会自动处理安装依赖项、编译、捆绑和热重载。

导入库对于 web 开发至关重要，所以 StackBlitz 包含了一个内置浏览器 npm 客户端，它支持一次安装多个软件包和特定的版本。

该项目的杀手级功能是离线编辑。Stackblitz 开发了一个浏览器内的网络服务器来实现这一点。通过 Stackblitz，您可以在单独的窗口中预览和编辑，这与其他项目中的 iframe 或小窗口相比是非常棒的。

其他值得注意的特性包括与 Github 连接以导入/导出项目，与 Google Firebase 集成以创建全堆栈项目，以及像 ZIP 文件那样下载项目。

Codeanywhere

Codeanywhere 伪装为 Web 浏览器和移动设备中的完整 IDE。

Codeanywhere 可以很容易地用 Javascript、 PHP、 HTML 和其他 72 种语言为您的项目建立自己的定制开发环境。

显而易见的主要特性是 Codeanywhere 可以连接任何东西，代码可以驻留在 FTP 服务器或者其他 Github 源代码上，但是你可以将它与 Codeanywhere 连接并开始编辑和开发。

在编辑器模式下，可以使用以下特性:

此外，您可以发挥布局和颜色的编辑器的修改。该工具有自己的内置终端。您还可以与任何开发人员共享整个项目、文件或文件夹。每个共享都可以有自己独特的权限。

Codeanywhere 包含一个实用的差异特性，允许您查看修订之间的差异，甚至允许您恢复到以前的代码状态。还有与 git 知识库和工具的深度集成，这些工具可以简化开发操作过程。这个产品适合那些想要移动到云端并永远留在那里的开发者。

JSfiddle

JSfiddle 是一个简单而又非常流行、快速和高效的在线代码编辑器。该工具允许您快速共享代码，并可视化查看结果，StackOverflow 与它集成在一起。 在视觉上，与大多数竞争者一样，该界面分为 4 个块：一个用于编写代码的块、一个用于编辑 CSS、SCSS 或 sass 的代码，一个用于 HTML 布局的块以及一个具有可见工作结果的块。

代码编辑块支持以下语言:

还可以在此块中更改各种设置，如加载类型、框架类型和框架属性。这个工具还有非常好和完整的文档，以及一个开发的社区，它可以投票决定哪些特性将首先被开发接受。

使用 Vue、 Jquery、 React + JSX 和其他语言编写的一些流行样板文件也促进了开发。至于缺点，JSfiddle 只用于前端工作。它不支持文件和文件夹的概念，也没有办法构建 CI/CD 管道。

一般来说，这是测试新框架最合乎逻辑和最酷的选择之一，在新产品的文章和演示中演示代码。

Codeply

Codeply: 市场上又一个快速编辑 Javascript 及其框架的工具。该产品最初于2014年发布，2019年发布了第二版。

可以让你编辑 angular、react、Vue、HTML 引导程序和纯 Javascript。该公司背后的团队表示，该产品适用于快速原型设计，创建模型，学习和探索新的流行库、API、插件和框架。

标准功能集包括布局设置、结果预览、现成模板和社交网络元素。与其他工具相比，速度相当独特。

Gitpod

Gitpod 旨在保持代码始终处于测试状态并保持最新状态。它与 Github 紧密集成：每次更新代码时，它都会运行测试。

该产品具有VScode接口，并支持所有主要的后端/前端语言和框架（如 Django、Rails、Revel 等）。

Plnkr

Plunker 是一个在线社区，用于创建，协作和共享 Web 开发想法。

Plunker 的核心功能是速度。尽管复杂，但 Plunker 编辑器的设计目的是在 2 秒内加载。

显著特点:

18 浏览
0 评论