我曾尝试使用brace(ace编辑器的browserify兼容版本)实现ace编辑器lib的自定义模式。
我有这个ace模块,在没有支架的其他项目上运行良好。当这段代码使用require函数导入modules/ext时,inners requires被破坏,即使我将文件放在正确的文件夹中。
我尝试在哪里放置文件,然后导入
尝试1:节点模块文件夹: node_module/brace/mode/[files here]
尝试2:应用程序文件夹: src/ace/[files here]
错误如下:
mode-clickhouse.js?51d8:14 Uncaught TypeError: Cannot read property 'ClickhouseHighlightRules' of undefined
需要导入后找不到导入模块。ace模式来自于tabix.io项目,是clickhouse的gui
自定义模式ace:link的路径
自定义模式子模块的路径:链接
下面是我如何导入这个自定义ace模式。我在这里使用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
暂无答案!
目前还没有任何答案,快来回答吧!