Ace editor "define не определен"

Я пытаюсь добавить редактор туза в свое приложение. Я загрузил его из github, сбросил каталог "ace/lib/ace" в каталог моего приложения, включая:

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

в теге моего тела и:

editor = ace.edit "editor"

в теге script. Я попытался загрузить страницу в Chrome и Firefox, и я получил определение "define не определено" в ace.js: 46. Строка в ace.js:

define(function(require, exports, module) {

Кто-нибудь знает, почему туз ожидает существования функции define() и почему ее не находит? Вот мой источник:

<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>

Ответ 1

Если у вас уже есть источник, то это довольно легко сделать. Просто зайдите в каталог, в котором вы скопировали весь источник туза.

Тогда do:

npm install
node Makefile.dryice.js

Смотрите wiki для получения дополнительной информации https://github.com/ajaxorg/ace/wiki/Building-ace

Ответ 2

Вы получаете эту ошибку, потому что библиотека RequireJS не включена в вашу страницу.

Чтобы исправить это, используйте либо сборку ace, либо включите RequireJS на свою страницу.

Если вы решите включить RequireJS, ваш html-фрагмент будет выглядеть примерно так:

<!-- 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

Я взломал его, поместив window.define = ace.define; в свой обработчик DOMload.

Ответ 4

В качестве альтернативы вы можете использовать cdn

И замените

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

С чем-то вроде

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