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

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

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

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


javascript ace-editor syntax-highlighting
person Dylan    schedule 09.04.2013    source источник

Ответы (3)


arrow_upward
36
arrow_downward

Теперь 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".

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

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

person a user    schedule 09.04.2013
comment
Это было объединено? Как им теперь пользоваться? - person Ciro Santilli 新疆再教育营六四事件ۍ 15.08.2014
comment
Обновлен ответ, чтобы включить ссылки на демонстрационные страницы ace. - person a user; 15.08.2014
comment
Спасибо, сэр! и вот ваш плюс. В ответ добавлена ​​точная команда, чтобы ее было легче найти. - person Ciro Santilli 新疆再教育营六四事件ۍ 15.08.2014
comment
У меня не работает Uncaught TypeError: Cannot read property 'getModeForPath' of undefined - ace.require возвращает undefined :( - person fnkr; 28.03.2015
comment
Вы включили файл ext-modelist.js, как показано в демо? - person a user; 28.03.2015

arrow_upward
0
arrow_downward

Вот как я это решил. Это более обновленная версия, которую я использовал в своем проекте 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>
person peter    schedule 15.03.2018
comment
полный путь = /folder/otherFolder/file.conf - person peter; 15.03.2018
comment
editor.setOptions({ enableBasicAutocompletion: true, enableSnippets: true, enableLiveAutocompletion: true }); - person peter; 15.03.2018

arrow_upward
0
arrow_downward

Ключ: editor.session.setMode(mode.mode);

<!-- ace editor -->
<script src="/ace/v1_4_11/ace.js"></script>
<script src="/ace/v1_4_11/ext-modelist.js"></script>
<script src="/ace/v1_4_11/ext-language_tools.js"></script>

let editor = null;      // reference to the Ace editor
let aceModeList = null; // used by the Ace editor

function initializeAceEditor() {
    aceModeList = ace.require("ace/ext/modelist");
    editor = ace.edit("aceEditorDiv");
}

// load the file and set the file-extension specific mode
let mode = aceModeList.getModeForPath(fileName); // detects for example .xml - or any other file extebsion
console.log(`Ace: selected mode = ${mode.mode}`);
try {
    editor.session.setMode(mode.mode);
} catch (e) {
    console.log("Ace: No specific mode available for file extension");
}

editor.getSession().setValue(Base64.decode(fileContentB64));

Нет необходимости предварительно загружать файл *.js определенного режима в браузере, например, «mode-xml.js». Соответствующий файл режима автоматически загружается по требованию.

person mutong    schedule 03.06.2020
comment
чтобы быть более полезным, вы можете включить пример установки режима на основе расширения файла, как было задано. - person sbkrogers; 04.06.2020
comment
В этом примере режим определяется автоматически на основе расширения файла fileName. Поддерживаются любые расширения файлов и автоматически устанавливается соответствующий режим. aceModeList.getModeForPath(fileName) выполняет эту задачу - вы можете взглянуть на исходный код Ace. - person mutong; 04.06.2020