Ace 是一款用 JavaScript 编写的独立代码编辑器。我们的目标是创建一个基于浏览器的编辑器,使其功能、易用性和性能与 TextMate、Vim 或 Eclipse 等现有原生编辑器相媲美,并得到进一步扩展。它可以轻松嵌入到任何网页或 JavaScript 应用程序中。Ace 是 Cloud9 IDE 的主要编辑器,也是 Mozilla Skywriter(Bespin)项目的继任者。
查看 Ace 的实时 演示 或注册一个 Cloud9 IDE 帐户,在编辑您自己的 GitHub 项目时体验 Ace。
如果您愿意,可以使用 Ace Bookmarklet 来使用 Ace 替代文本区域。
Ace 可以轻松嵌入到任何现有网页中。您可以使用 ace 的预打包版本(只需将 src* 子目录复制到项目中的某个位置即可),或者使用 requireJS 将 lib/ace 的内容加载为 ace。
最简单的版本如下:
<div id="editor">some text</div>
<script src="src/ace.js" type="text/javascript" charset="utf-8"></script>
<script>
var editor = ace.edit("editor");
</script>
探索配置选项 Configuring-Ace
其中“editor”是 DOM 元素的 ID,该元素应转换为编辑器。请注意,该元素必须明确指定“绝对”或“相对”的大小和位置,Ace 才能正常工作。例如:
#editor {
position: absolute;
width: 500px;
height: 400px;
}
要更改主题,只需包含主题的 JavaScript 文件
<script src="src/theme-twilight.js" type="text/javascript" charset="utf-8"></script>
并配置编辑器以使用主题:
editor.setTheme("ace/theme/twilight");
默认情况下,编辑器仅支持纯文本模式;许多其他语言可作为单独的模块使用。添加该模式的 JavaScript 文件后:
<script src="src/mode-javascript.js" type="text/javascript" charset="utf-8"></script>
然后可以像这样使用该模式:
var JavaScriptMode = ace.require("ace/mode/javascript").Mode;
editor.session.setMode(new JavaScriptMode());
销毁编辑器的使用
editor.destroy();
editor.container.remove();
更多使用信息,包括监听事件和扩展语法高亮器,可在 Ace 主网站 上找到。
您还可以在 https://ajaxorg.github.io/ace-api-docs/ 找到 API 文档。
还可以查看 Kitchen Sink 演示应用 的示例代码。
如果您仍然需要帮助,请随时在我们的 讨论页面 上提问。
检出后,Ace 开箱即用。无需构建步骤。要试用,只需使用 Node.JS 启动捆绑的迷你 HTTP 服务器即可。
node ./static.js
然后可以通过 http://localhost:8888/kitchen-sink.html 打开编辑器。
要使用 file:/// URL 打开编辑器,请参阅 wiki。
通常情况下,您无需构建 ACE。ace-builds 仓库 会尽力维护最新版本,您只需将 src* 子目录复制到项目中即可。
不过,您只需要安装 Node.js 和 npm 即可打包 ACE。只需在 ace 文件夹中运行 npm install 即可安装依赖项:
npm install
node ./Makefile.dryice.js
为了打包 Ace,我们使用 Mozilla Skywriter 团队开发的 dryice 构建工具。在命令行中运行 node Makefile.dryice.js 即可开始打包。此构建脚本接受以下选项:
-m 使用 uglify-js 压缩构建文件
-nc namespace require 并使用 "ace" 定义定义
-bm 构建书签版本
--target ./path 指定输出文件夹的相对路径(默认值为 "./build")
要生成 ace-builds 仓库中的所有文件,请运行 node Makefile.dryice.js full --target ../ace-builds
Ace 单元测试可以在 node.js 上运行。假设您已经执行了 npm install,只需调用:
npm run test
您也可以通过以下方式在浏览器中运行测试:
http://localhost:8888/src/test/tests.html
这使得调试失败的测试变得更加容易。
Ace 是一个社区项目,如果没有贡献,就不会有今天的成就!我们积极鼓励和支持贡献。Ace 源代码采用 BSD 许可证发布。该许可证非常简单,并且对各种项目(无论是否开源)都友好。掌控您的编辑器,添加您喜欢的语言高亮和快捷键!
您可以随意 fork 并以任何您想要的方式改进/增强 Ace。如果您认为您的更改将使编辑器或 Ace 社区受益,请提交拉取请求。有关我们贡献指南的更多信息,请参阅 CONTRIBUTING.md。