Question

I am trying to embed ace code editor in my project. I am initializing my code editor with following code and now I want to enable emmet js features. I can see the ext-emmet.js extension is already their in the src directory of ace.js pre-packaged version

I need help in enabling emmet extension features. So here is my initialization code.

  var e = ace.edit("editorId"); // id of the code editor div 
  e.setTheme("ace/theme/monokai");
  e.getSession().setMode("ace/mode/html");
  e.setBehavioursEnabled(true);
  e.getSession().setTabSize(2);

Obviously I am adding the ace.js on top of the page. I can provide more details if needed.

Was it helpful?

Solution

See Lines 539-543 in ace demo.

Basically you need to load emmet source script (e.g. from https://github.com/nightwing/emmet-core/blob/master/emmet.js) and ace extension from /src/ext-emmet.js call require("ace/ext/emmet"); so that requirejs executes the script
And after that call editor.setOption("enableEmmet", true);.
See jsbin.com/ace-emmet/1/edit for live demo.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top