ace is an excellent open source online code editor
github Download Address: https://github.com/ajaxorg/ace
- Download source > Open command line window - git clone https://github.com/ajaxorg/ace.git
2. Enter ace-demo directory, each html page has different functions, you can test and see for yourself.
But when you open the autocompletion.html page, you report the following error
couldn't find ace.js file, to build it run node Makefile.dryice.js full
Because we need to compile ace source code.
3. Compile ace source code. Look at the Readme.md file in the ace root directory and compile it as follows.
Building Ace ----------- You do not generally need to build ACE. The [ace-builds repository](https://github.com/ajaxorg/ace-builds/) endeavours to maintain the latest build, and you can just copy one of _src*_ subdirectories somewhere into your project. However, all you need is Node.js and npm installed to package ACE. Just run `npm install` in the ace folder to install dependencies: ```bash npm install node ./Makefile.dryice.js
4. Change the autocompletion. HTML (Autoprompt + Lenovo) file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ACE Autocompletion demo</title>
<style type="text/css" media="screen">
body {
overflow: hidden;
}
#editor {
margin: 0;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
</style>
</head>
<body>
<pre id="editor"></pre>
<!-- load ace -->
<script src="../build/src/ace.js"></script>
<!-- load ace language tools -->
<script src="../build/src/ext-language_tools.js"></script>
<script>
// trigger extension
ace.require("ace/ext/language_tools");
var editor = ace.edit("editor");
editor.session.setMode("ace/mode/html");
editor.setTheme("ace/theme/tomorrow");
// enable autocompletion and snippets
editor.setOptions({
enableBasicAutocompletion: true,
enableSnippets: true,
enableLiveAutocompletion: true
});
</script>
<script src="./show_own_source.js"></script>
</body>
</html>