统计
  • 建站日期:2019-12-01
  • 文章总数:2002 篇
  • 评论总数:2124 条
  • 分类总数:21 个
  • 最后更新:11月21日
文章 未分类

Ace editor 在线网页版的vscode!代码编辑器

程序员阿鑫
首页 未分类 正文

Ace是一个功能非常强大的编辑器。它实现了语法着色,缩进,代码提示功能。且具有大量的主题,支持大量语言。


Aceeditor在线网页版的vscode!代码编辑器
-程序员阿鑫-带你一起秃头
-第1
张图片

官网地址:https://ace.c9.io/
Github: https://github.com/ajaxorg/ace/
vue版:https://github.com/chairuosen/vue2-ace-editor

    <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.6/ace.js" type="text/javascript"
            charset="utf-8"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.6/ext-language_tools.js" 
            type="text/javascript" charset="utf-8"></script>
           <pre id="code" class="ace_editor" style="min-height:400px">
                    <textarea class="ace_text-input"></textarea>
                </pre>

<script>
    //初始化对象
    editor = ace.edit("code");

    //设置风格和语言(更多风格和语言,请到github上相应目录查看)
    theme = "monokai"
    language = "java"
    editor.setTheme("ace/theme/" + theme);
    editor.session.setMode("ace/mode/" + language);

    //字体大小
    editor.setFontSize(18);

    //设置只读(true时只读,用于展示代码)
    editor.setReadOnly(false);

    //自动换行,设置为off关闭
    editor.setOption("wrap", "free")

    //启用提示菜单
    ace.require("ace/mode/java");
    editor.setOptions({
        enableBasicAutocompletion: true,
        enableSnippets: true,
        enableLiveAutocompletion: true
    });
</script>

中文文档:https://www.jianshu.com/p/8a4a5e273538

版权说明
文章采用: 《署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)》许可协议授权。
版权声明:未标注转载均为本站原创,转载时请以链接形式注明文章出处。如有侵权、不妥之处,请联系站长删除。敬请谅解!

-- 展开阅读全文 --
这篇文章最后更新于2021-5-9,已超过 1 年没有更新,如果文章内容或图片资源失效,请留言反馈,我们会及时处理,谢谢!
Laravel项目全站接入ajax
« 上一篇
postman登录鉴权,获取token后进行其他接口测试
下一篇 »

发表评论