添加到ace-editor明智的自动完成:列出用户定义的函数和变量(javascript语言)

Question

我想在ace编辑器的自动完成中添加用户定义的函数和变量列表.为此,我想检查插入到文档中的所有代码用户,查找已定义的函数(及其参数),定义的变量及其范围等.

主要问题

这些数据是否已经在ace源代码(或语言插件)中的某处计算过,我可以在某种程度上抓住它？

我想要的是

为了exapmle,如果用户插入这样的代码:

var var0 = 'abcd';

function foo(var1, var2){
  var var3 = 'efg';
}

我想添加到自动完成框中,称为'foo'的函数有两个参数 - var1和var2.我想将var0添加到变量列表中,并在用户在定义的范围内(在函数中)写入时添加var3.

我所知道的:

• 我知道如何启用自动完成和实时自动完成.
• 我知道如何添加新的完成者
• 我知道内置的Basic自动完成在文档中不加区别地添加所有单词
• 我知道ace-tern插件,我认为我不想使用它.现在它仍然是hackish,无文档,我无法想象如何启用它.
• 我知道Ace已经拥有了我想要的一些数据.例如,当已在同一范围内定义变量时,它会发出警告.所以它有变量列表及其范围.我的猜测是使用jshint - 但有没有办法从那里抓住它？
• 我阅读了ace文档,并找到了许多有用的方法,我可以使用它来提取数据,如果必须的话.问题是我是否真的需要自己做这件事.

Answer 1

更新：我在我的答案中暗示了这一点，但为了澄清起见，Tern会完全按照您的要求做我想要的事情。下面的代码段解决了另一个问题，即提供一些您甚至不希望用户在编辑器中看到的上下文。查看Ace.Tern现场演示中使用的代码的屏幕截图

那是有选择的，但是imo在ace中添加自动完成功能的最佳选择是Tern。

Tern接受typedef配置选项（在此处进行描述：http : //ternjs.net/doc/manual.html#typedef），但是更有趣的是，它将自定义js对象作为子对象接受，即：

var myContext = {
   name: 'myContext',
   obj: obj
}

obj您的js对象在哪里。然后在Tern配置中，将其用作：

defs：['underscore'，myContext]

它将使用您的自定义对象和下划线模块进行自动完成。

与Tern相关的ace.js配置：（有关配置选项的注释，请参见https://github.com/sevin7676/Ace.Tern/blob/master/demo.html）

  var myContext = { ... }

  var editor = ace.edit("editor");
    editor.getSession().setUseWorker(true);

    ace.config.loadModule('ace/ext/tern', function () {
        editor.setOptions({
            enableTern: {
                defs: ['browser', 'ecma5', myContext],
                plugins: {
                    doc_comment: {
                        fullDocs: true
                    }
                },                    
                useWorker: true,                    
                startedCb: function () {
                    console.log('editor.ternServer:', editor.ternServer);
                },
            },
            enableSnippets: true,
            enableBasicAutocompletion: true,
        });
    });