Search code examples
ace-editor

Attach a local mode to Ace Editor from CDN

If I load Ace Editor from a CDN:
https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.3/ace.js

Is it possible to download a mode from another location:
http://hello.processing.org/js/vendor/ace/mode-processing.js

Suppose I download the mode in the second link above. Can I then load it into Ace Editor on my site even though Ace is connected via CDN? How can I attach this custom mode?

I've tried the following related answers with no luck:
https://stackoverflow.com/a/17509307/1161948
https://stackoverflow.com/a/25216371/1161948

Solution

  • the file you are showing is not a theme it's a mode. You can use it by adding the script element to that file yourself, or use ace.config.setModuleUrl method tell ace which url to use when downloading "ace/mode/processing"

    <script src=https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.3/ace.js></script>

<div id=editor></div>
<style >
  #editor {position: absolute; top: 0; bottom: 0; left: 0; right: 0}
</style>
<script>
  var editor = ace.edit("editor")
  ace.config.setModuleUrl("ace/mode/processing", "http://hello.processing.org/js/vendor/ace/mode-processing.js")
  editor.setOption("mode", "ace/mode/processing")
</script>