ace.js初始化函数封装

ace介绍

ACE 是一个开源的、独立的、基于浏览器的代码编辑器，可以嵌入到任何web页面或JavaScript应用程序中。ACE支持超过60种语言语法高亮，并能够处理代码多达400万行的大型文档。ACE开发团队称，ACE在性能和功能上可以媲美本地代码编辑器（如Sublime Text、TextMate和Vim等）。

下载编译

git clone https://github.com/ajaxorg/ace.git
npm install
node ./Makefile.dryice.js

初始化函数封装示例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    //必须给包裹元素设置宽高
    <style>
         #editor{
             width:600px;
             height:300px;
         }
    </style>
</head>
<body>
    <div id="editor"></div>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.6/ace.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.6/ext-language_tools.js"></script>
    <script>
         //初始化editor：ace.edit(domIdStr[string])
         var editor = ace.edit('editor');
         init_acs('json', 'monokai', editor);
         function init_acs(language, theme, editor) {
            //设置主题
            editor.setTheme("ace/theme/" + theme);
            //设置编辑语言
            editor.session.setMode("ace/mode/" + language);
            //设置字体大小
            editor.setFontSize(15);
            设置是否只读
            //editor.setReadOnly(false);
            //自动换行,设置为off关闭
            editor.setOption("wrap", "free");
            //启用提示菜单
            ace.require("ace/ext/language_tools");
            editor.setOptions({
                enableBasicAutocompletion: true,
                enableSnippets: true,
                enableLiveAutocompletion: true,
                autoScrollEditorIntoView: true
            });
        }
    </script>
</body>
</html>

来源：CSDN

作者：我心依依旧

链接：https://blog.csdn.net/a200822146085/article/details/103927614

标签

初始化

ace

函数封装

editor