19

我正在开发一个使用 java/scala 后端（确切地说是Lift，虽然这不应该影响这个问题）的项目，并且作为前端的一部分，我们使用Ace Editor。我已经在谷歌上搜索了一段时间，但还没有找到这个问题的答案：

给定一个文件扩展名（例如js, c, cpp, h, java,rb等），我怎样才能自动选择适当语言的 Ace“模式”？

我希望避免手动创建地图 la js -> javascript, c -> c_cpp, java -> java。是否有可用的 java/scala 库？或者更好的是，Ace 是否以某种方式内置了此功能？

4

3 回答 3

36

Ace 现在提供了模型扩展来做到这一点。

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使用它

于 2013-04-09T21:50:31.307 回答
0

这是我解决它的方法。这是我在 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>
于 2018-03-15T11:16:04.750 回答
0

关键是 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”。相应的模式文件会按需自动加载。

于 2020-06-03T23:31:22.863 回答