时间戳

首页 > 解决方案 > 将自定义 ACE 编辑器模式导入 Brace 时，需要调用找不到帮助模块

javascript - 将自定义 ACE 编辑器模式导入 Brace 时，需要调用找不到帮助模块

问题描述

我尝试使用Brace（ace 编辑器的 browserify 兼容版本）实现ACE Editor lib的自定义模式。

我有这个 ace 模块，可以在没有 Brace 的其他项目上正常工作。当此代码使用 require 函数导入模块/扩展时，即使我将文件放在正确的文件夹中，内部要求也会损坏。

我在哪里尝试放置文件，然后导入

这是错误：

mode-clickhouse.js?51d8:14 Uncaught TypeError: Cannot read property 'ClickhouseHighlightRules' of undefined

它表明导入后的要求无法找到导入模块。Ace 模式来自 Tabix.io 项目， ClickHouse的 GUI

  1. 自定义模式 ACE 的路径：链接
  2. 自定义模式子模块的路径：链接

这是我导入此自定义 ACE Mode的方式。我在这里使用 Vue，但我确信 vue 不是问题生成器。

<script lang="ts">
    import { Component, Vue, Watch } from 'vue-property-decorator';
    import * as brace from 'brace';
    // const ace = brace

    // OBS.: this one does not work
    // require('./ace/clickhouse_highlight_rule');
    // require('./ace/mode-clickhouse');

    // OBS.: this one does not work too
    import 'brace/mode/mode-clickhouse';

// ... more code
</script>

这是被破坏的代码部分


ace.define("ace/mode/clickhouse", ["require", "exports", "module", "ace/lib/oop", "ace/mode/text",
    "ace/token_iterator",
    "ace/mode/folding",
    "ace/mode/clickhouse_FoldMode",
    "ace/mode/clickhouse_highlight_rules"

], function (require, exports) {
    "use strict";

    let oop = require("../lib/oop");
    let TextMode = require("./text").Mode;

// OBS.: ---> ERROR HERE
    let ClickhouseHighlightRules = require("./clickhouse_highlight_rules").ClickhouseHighlightRules;
    let ClickhouseFoldMode = require("./clickhouse_FoldMode").FoldMode;
    let MatchingBraceOutdent = require("./matching_brace_outdent").MatchingBraceOutdent;
    let CstyleBehaviour = require("./behaviour/cstyle").CstyleBehaviour;

    let Mode = function () {

        this.foldingRules = new ClickhouseFoldMode();
        this.$outdent = new MatchingBraceOutdent();
        this.$behaviour = new CstyleBehaviour();
        this.HighlightRules = ClickhouseHighlightRules;
    };

// more code here

标签： javascriptrequirejsace-editorclickhouse

解决方案

推荐阅读