2012-06-04 9 views
12

Ich versuche, die ace editor zu meiner App hinzufügen. Ich heruntergeladen es von Github, ließ das "ace/lib/ace" Verzeichnis in meine App-Verzeichnis enthalten:Ace Editor "Definieren ist nicht definiert"

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

in meinem Körper Tag und:

editor = ace.edit "editor" 

in meinem Skript-Tag. Ich habe versucht, die Seite in Chrome und Firefox zu laden, und ich bekomme "define ist nicht definiert" in ace.js: 46. Die Linie in ace.js ist:

define(function(require, exports, module) { 

Weiß jemand, warum Ass erwartet die Funktion define() zu existieren und warum es nicht, es zu finden? Hier ist meine Quelle:

<html> 
    <body> 
    <div id="editor">some text</div> 
    <script src="ace/lib/ace/ace.js" type="text/javascript" charset="utf-8"></script> 
    <script> 
     var editor = ace.edit("editor"); 
    </script> 
    </body> 
</html> 
+0

Ich sehe ein Div-Tag mit einer ID von "Editor" im obigen Snippet. Hast du nicht? Ich habe aktualisiert, um schlechte Formatierung in meinem ursprünglichen Post zu korrigieren, Sie haben das vielleicht gesehen. In meinem eigentlichen Code (bevor ich es auf das einfache Beispiel oben reduziert habe) habe ich den Stil aus dem oben verlinkten Beispiel kopiert und importiere das, aber es sieht so aus, als wenn ich meine App nur auf den Ace-Code heruntergezogen habe auch. Ich werde versuchen, mein Beispiel zu ändern und hier bald zu aktualisieren. – Stinky

+0

Ich habe das gleiche Problem ... Hast du es jemals herausgefunden? – orokusaki

+0

Nein, tut mir leid. Ich entschied, dass es meine Zeit nicht wert war. Viel Glück. – Stinky

Antwort

7

Wenn Sie bereits die Quelle haben, dann ist es ziemlich einfach, immer noch zu tun. Gehe einfach in das Verzeichnis, in das du alle Ass-Quellen kopiert hast.

Dann tun:

npm install 
node Makefile.dryice.js 

Siehe Wiki für weitere Details https://github.com/ajaxorg/ace/wiki/Building-ace

+1

Vielen Dank. Ich habe vergessen, den Code tatsächlich zu erstellen, und dein Kommentar hat mich daran erinnert, es zu tun. Hoppla. ☺ –

+0

+1 Cuz, welp, habe ich das gleiche – jakev

4

Sie erhalten diesen Fehler, da die RequireJS JavaScript-Bibliothek ist auf Ihrer Seite nicht berücksichtigt.

Um dies zu beheben, verwenden Sie entweder ein Ass Build oder RequireJS in Ihre Seite aufnehmen.

Wenn Sie RequireJS Ihre HTML-Fragment enthalten wird wie folgt aussehen:

<!-- Editor will go here --> 
<div id="editor"></div> 

<!-- Load RequireJS --> 
<script src="lib/requirejs/require.js"></script> 

<!-- Initialize ace --> 
<script> 

    // Tell RequireJS where ace is located 
    require.config({ 
     paths: { 
      'ace': 'lib/ace' 
     } 
    }); 

    // Load the ace module 
    require(['ace/ace'], function(ace) { 
     // Set up the editor 
     var editor = ace.edit('editor'); 
     editor.setTheme('ace/theme/monokai'); 
     editor.getSession().setMode('ace/mode/javascript'); 
     // etc... 
    }); 
</script> 
3

ich gehackt es durch window.define = ace.define; in meinem DOMload Handler setzen.

-3

Alternativ können Sie ein CDN verwenden

Und

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

Mit so etwas wie

<script src="http://cdnjs.cloudflare.com/ajax/libs/ace/1.1.3/ace.js" type="text/javascript" charset="utf-8"></script> 
+0

Dies ist nicht das Problem in keiner Weise – Pirijan