Question

I am Implementing ace into my site for the first time and I have some noob questions. I have only been programming for about a year so bear with me.

I have downloaded the code from https://github.com/ajaxorg/ace. I am assuming (could be wrong) the code I need lies in /lib/ace/ so I copied the ace folder to my /lib/js/ in my dev environment. I imported the ace.js per the instructions on the github wiki.

   <script type="text/javascript" src="lib/js/ace/ace.js" charset="utf-8"></script>

I have my HTML code also:

<script>
 window.onload = function() {
        var editor = ace.edit("editor");
        editor.setTheme("ace/theme/twilight");

        var JavaScriptMode = require("ace/mode/javascript").Mode;
        editor.getSession().setMode(new JavaScriptMode())
    };
</script>
<div id="editor"></div>

CSS:

   #editor {  
        width: 800px;
        height: 690px;
    }

Firebug tells me ace is not defined where I am declaring my variable “editor” and also gives me this output:

missing variable name
const function (require, exports, module) {

that is from the ace.js. So I am missing something with getting this basic Implementation working.

Answer 1

You downloaded the source which requires require.js.

You should download one of the builds from https://github.com/ajaxorg/ace-builds
to get started without additional requirements.