Как автоматически выбрать "режим" для Ace Editor, учитывая расширение файла

Я работаю над проектом, который использует бэкэнд java / scala (лифт, если быть точным, хотя это не должно влиять на этот вопрос), и как часть фронтэнда мы используем Редактор Ace. Я погуглил немного и не нашел ответа на этот вопрос:

учитывая расширение файла (например,js, c, cpp, h, java, rb и т. д.), Как я могу автоматически выбрать Ace "mode" для соответствующего язык?

Я надеюсь избежать ручного создания карты, a la js -> javascript, c -> c_cpp, java -> java. Для этого доступна библиотека java/scala? Или еще лучше, у Ace есть эта функциональность, встроенная каким-то образом?

12
ace-editor javascript syntax-highlighting

2 ответов

Ace теперь предоставляет расширение modelist для этого.

var modelist = ace.require("ace/ext/modelist")
var filePath = "blahblah/weee/some.js"
var mode = modelist.getModeForPath(filePath).mode
editor.session.setMode(mode) // mode now contains "ace/mode/javascript".

обратите внимание, что если вы используете prebuilt версия ace вам нужно включить ace.js и ext-modelist.js файлы на Вашей странице.
С исходной версией, вам нужно заменить ace.require С require и требуют.js автоматически загрузит все зависимости.

см.https://github.com/ajaxorg/ace/blob/master/demo/modelist.html и https://github.com/ajaxorg/ace-builds/blob/master/demo/modelist.html примеры как его использовать

26

вот как я ее решал. Это более обновленная версия, которую я использовал в своем проекте Django.

    <script src="{% static 'ace/src-noconflict/ace.js' %}" type="text/javascript" charset="utf-8"></script>
<script src="{% static 'ace/src-noconflict/ext-modelist.js' %}"></script>
<script src="{% static 'ace/src-noconflict/ext-language_tools.js' %}"></script>

<script>
    var modelist = ace.require("ace/ext/modelist");
    var editor = ace.edit("editor");
    editor.renderer.setScrollMargin(40, 150)
    document.getElementById('editor').style.fontSize = '15px';
    editor.setTheme("ace/theme/dracula");

    var full_path = "{{ file.directory_path }}";
    document.getElementById("demo").innerHTML = full_path
    var mode = modelist.getModeForPath(full_path);//mode
    console.log(mode);
    editor.session.setMode(mode.mode);
    //Ace editor autocompletion
    editor.setOptions({
        enableBasicAutocompletion: true,
        enableSnippets: true,
        enableLiveAutocompletion: true
    });

</script>
0