Question

Java Script和我不是朋友。

Ace是javascript中的代码ide，可以编写自定义模式，将自定义片段添加到模式，编写自定义自动填充程序。我知道如何编写代码，这些代码可以帮助我理解如何将这些东西集成到JavaScript中。

有这个定义（＆＃34;模式/ blabla＆＃34;，[＆＃34;导出＆＃34;，＆＃34;模块，..]，（导出，模块） - ＆gt; {} 看起来非常类似于角度加载模块，但是当我在html中添加脚本时，它不知道define方法。我是否需要构建整个内容才能使其工作。就像把文件放在ace文件夹中并构建它一样。我真的很想只使用bower import angular-ace-ui然后自己喂我的小模式，突出显示，完成文件。所以我可以让我自己的东西很容易访问，可编辑并与我在bower-components / ace-builds /中的完整ace分开。

有人可以向我解释或指向一个好的学习材料，教我如何依赖，导入，功能集成在像ace这样的java脚本项目中工作。我理解Java，但java脚本很奇怪，很难遍历代码以查看事物的来源和去处。

我尝试了这个，但这不起作用，因为它不在构建过程中，我不知道在哪里寻找钩子。

＆＃13;

< script src = "../src-noconflict/ace.js" > < /script>
<!-- load ace language tools -->
<script src="../src - noconflict / ext - language_tools.js "></script>
<script src=".. / .. / .. / app / scripts / editor / mode / myql.js "></script>
<script src=".. / .. / .. / app / scripts / editor / snippets / myql.js "></script>
<script>
    // trigger extension
    var langtools = ace.require("
ace / ext / language_tools ");
    var editor = ace.edit("
editor ");
    editor.session.setMode("
ace / mode / myql ");
    editor.setTheme("
ace / theme / chrome ");

    // enable autocompletion and snippets
    editor.setOptions({
        enableBasicAutocompletion: true,
        enableSnippets: true,
        enableLiveAutocompletion: true
    });
</script>

＆＃13;

我想得到这样的东西＆＃39;自动完成/完成者＆＃39; ＆＃39; ACE /模式/ myql＆＃39;是我希望整合的模块。我得到了下来和脏代码，但没有让它可访问的方式。这些文件的形式类似于模式，请参见sql.js和sql_highlight_rules.js https://github.com/ajaxorg/ace/tree/master/lib/ace/mode

＆＃13;

 <div ui-ace="{
            useWrapMode : true,
            showGutter: false,
            theme:'chrome',
            mode: 'mysql',
            require: ['ace/ext/language_tools','autocomplete/mycompleter','ace/mode/myql'],
            advanced: {
                enableSnippets: true,
                enableBasicAutocompletion: true,
                enableLiveAutocompletion: true
            }
          }"></div>

＆＃13;

Answer 1

我认为我找到了解决问题的正确方法。忘记angular-ace-ui它只会使事情复杂化。

bower install ace

放置custom_mode.js，custom_highlight_rules.js，custom_snippets.js，customer_snippets.txt，custom_completer.js 在源文件夹中的某个位置。将它们设置为与

中的类似文件完全相同

bower_components/ace/lib.ace/
    ./mode
    ./snippets
    ./autocomplete

设置一个grunt或gulp或任何构建任务将工作目录中的文件复制到上面提到的bower_components文件夹中。然后运行ace构建节点./Makefile.dryice.js

现在通过您需要的bower覆盖

导入工作文件

"overrides": {
    "ace": {
      "main": [
        "build/src-min-noconflict/ace.js",
        "build/src-min-noconflict/ext-language_tools.js",
        "build/src-min-noconflict/theme-monokai.js",
        "build/src-min-noconflict/custom_mode.js",
        "build/src-min-noconflict/snippets/custom_mode.js"
      ]
    }

通常只有在更改内容时才需要ace版本，并且不需要减慢默认的应用程序版本。我还没有尝试过，但理论上我认为没有理由不这样做。我认为这是使用自定义版本轻松工作的最简单方法，同时保持外部ace文件不受影响。

我玩弄了这个想法，使用ace-ui角度控制器在onload中设置所有内容，但模式需要通过模式名称引用。它适用于完成者，因为它只需要调用langTools.addCompleter（newcompleter）方法并使用getCompletions函数参数传入一个对象。然而，模式需要以某种方式注册为已定义，并且我不知道如何在ace构建管道之外执行此操作。我的解决方案看起来就像它一样。

扩展ace编辑器，如何导入自定义文件

1 个答案: