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.

---

❗ISSUES ARE DISABLED IN THIS REPOSITORY❗

This repository has only generated files. To report your issues, suggest features, ask questions, or work on Ace editor itself please go to Ace repository https://github.com/ajaxorg/ace.

---

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.35.0 (2024-06-11)

Features

• allow '{n}' as placeholder for translated strings (#5581) (2206024)

Bug Fixes

• allow setting the placeholder type for nls (#5584) (3e2d50f)
• not closed generic state in case of left-shift operator (#5572) (e5bea6f)
• wrong vue-directives regexp (#5586) (5f89a33)