ace-builds

What is ace-builds?

The ace-builds npm package is a standalone code editor written in JavaScript. It is designed to be embedded easily in web pages and provides a rich set of features for code editing, including syntax highlighting, code folding, and autocompletion.

What are ace-builds's main functionalities?

Syntax Highlighting

This feature allows you to set syntax highlighting for different programming languages. In this example, the editor is set to highlight JavaScript syntax.

const ace = require('ace-builds');
const editor = ace.edit('editor');
editor.session.setMode('ace/mode/javascript');

Code Folding

Code folding allows users to collapse and expand sections of code, making it easier to navigate large files. This example sets the fold style to 'markbegin'.

const ace = require('ace-builds');
const editor = ace.edit('editor');
editor.session.setFoldStyle('markbegin');

Autocompletion

Autocompletion helps users write code faster by providing suggestions as they type. This example enables basic autocompletion, snippets, and live autocompletion.

const ace = require('ace-builds');
require('ace-builds/src-noconflict/ext-language_tools');
const editor = ace.edit('editor');
editor.setOptions({
  enableBasicAutocompletion: true,
  enableSnippets: true,
  enableLiveAutocompletion: true
});

Other packages similar to ace-builds

monaco-editor

The Monaco Editor is the code editor that powers VS Code. It provides similar functionalities to ace-builds, such as syntax highlighting, code folding, and autocompletion. However, it is more tightly integrated with the VS Code ecosystem and offers a more extensive set of features.

codemirror

CodeMirror is another versatile code editor implemented in JavaScript. It offers a wide range of features similar to ace-builds, including syntax highlighting, code folding, and autocompletion. CodeMirror is highly customizable and has a large community of users and contributors.

brace

Brace is a fork of the Ace editor, designed to be used with React. It provides the same core functionalities as ace-builds but is optimized for use in React applications. This makes it a good choice for developers working within the React ecosystem.

README

Ace (Ajax.org Cloud9 Editor)

Ace is a code editor written in JavaScript.

This repository has only generated files. If you want to work on ace please go to https://github.com/ajaxorg/ace instead.

To report any issues or feature requests regarding Ace please go here: https://github.com/ajaxorg/ace/issues

here you can find pre-built files for convenience of embedding. it contains 4 versions

• src concatenated but not minified
• src-min concatenated and minified with uglify.js
• src-noconflict uses ace.require instead of require
• src-min-noconflict concatenated, minified with uglify.js, and uses ace.require instead of require

For a simple way of embedding ace into webpage see editor.html or list of other simple examples To see ace in action go to kitchen-sink-demo, scrollable-page-demo or minimal demo,

Changelog

1.11.0 (2022-09-20)

Features

• add gutter indicators for annotations; add custom scrollbar to display gutter indicators (62fb0d8)

Bug Fixes

• change scroll behaviour for onmousedown to immediate scroll to point (392b224)
• Do not try apply highlight indent guide if the file is empty (#4928) (a90ef27)
• restrict annotation mark max height and optimise marks coords on canvas (a6e2259)