最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Advanced autocomplete in ACE Editor - Stack Overflow

programmeradmin2浏览0评论

I'm looking to add sophisticated code pletion to the ACE editor.

For example, if I typed the following JavaScript into ACE...

function Car() {}

Car.prototype = {
    model : '',
    maxSpeed : 0
};

var bugatti = new Car();
bugatti.

... upon hitting the dot after bugatti, the options "model" and "maxSpeed" would appear.

I know ACE has the new "enableBasicAutopletion" feature, but this seems very lacking. I'm hoping to have autoplete based on the code typed into the ACE editor, and appears by simply hitting the . key. The autoplete suggestions would be the properties for that object.

The closest thing I can find is in this YouTube video:

At 1:45, you can see the autoplete is based on the user's JavaScript, but there's no demo or explanation of how this was acplished.

I'm looking to add sophisticated code pletion to the ACE editor.

For example, if I typed the following JavaScript into ACE...

function Car() {}

Car.prototype = {
    model : '',
    maxSpeed : 0
};

var bugatti = new Car();
bugatti.

... upon hitting the dot after bugatti, the options "model" and "maxSpeed" would appear.

I know ACE has the new "enableBasicAutopletion" feature, but this seems very lacking. I'm hoping to have autoplete based on the code typed into the ACE editor, and appears by simply hitting the . key. The autoplete suggestions would be the properties for that object.

The closest thing I can find is in this YouTube video: http://youtu.be/CSEDIhT6bXU

At 1:45, you can see the autoplete is based on the user's JavaScript, but there's no demo or explanation of how this was acplished.

Share Improve this question asked Jan 21, 2015 at 22:11 gavanongavanon 1,36714 silver badges15 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 4

The TernJS project is what you are looking for.

Here's an example integration with ACE.

Yup its part of Ace nowadays. Although I did not find it documented in the API but rather through a hard net search: Add the ace/ext-language_tools.js to your html. The dot form does not work well yet, so you may have to enter ctrl-space or alt-space for that (although if you write a bit of the property/method you want to call it should show), but standard syntax stuff such as writting function, will now show. Then in your js:

var editor = ace.edit("editor");

ace.require("ace/ext/language_tools");
editor.setOptions({
    enableBasicAutopletion: true,
    enableSnippets: true,
    enableLiveAutopletion: true
});
发布评论

评论列表(0)

  1. 暂无评论