javascript - ACE 编辑器 Apache Freemarker 模板要求不加载

Question

简介

我要实现自定义模式https://github.com/heygrady/ace-mode-freemarker用于 Freemarker 模板 ( http://freemarker.org/ )。

我在我的 src-noconflict/ 文件夹中创建了一个文件 mode-freemarker.js。该文件表示此文件的代码:https://github.com/heygrady/ace-mode-freemarker/blob/master/freemarker.js .对于非冲突源，如果将 define() 行更改为

ace.define("ace/mode/freemarker", ["require", "exports", "module", "ace/lib/oop", "ace/mode/javascript"], function(require, exports, module) {

所以，整个文件看起来像:

/* ***** BEGIN LICENSE BLOCK *****
 * Distributed under the BSD license:
 *
 * Copyright (c) 2012, Ajax.org B.V.
 * All rights reserved.
 * 
 * Redistribution and use in source and binary forms, with or without
 * modification, are permitted provided that the following conditions are met:
 *     * Redistributions of source code must retain the above copyright
 *       notice, this list of conditions and the following disclaimer.
 *     * Redistributions in binary form must reproduce the above copyright
 *       notice, this list of conditions and the following disclaimer in the
 *       documentation and/or other materials provided with the distribution.
 *     * Neither the name of Ajax.org B.V. nor the
 *       names of its contributors may be used to endorse or promote products
 *       derived from this software without specific prior written permission.
 * 
 * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
 * ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
 * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
 * DISCLAIMED. IN NO EVENT SHALL AJAX.ORG B.V. BE LIABLE FOR ANY
 * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
 * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
 * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
 * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
 * SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 *
 *
 * Contributor(s):
 * 
 *
 *
 * ***** END LICENSE BLOCK ***** */

/*
  THIS FILE WAS AUTOGENERATED BY mode.tmpl.js
*/

/* global ace*/
ace.define("ace/mode/freemarker", ["require", "exports", "module", "ace/lib/oop", "ace/mode/javascript"], function(require, exports, module) {
	"use strict";

	var oop = require("../lib/oop");
	var TextMode = require("./text").Mode;
	var JavaScriptMode = require("./javascript").Mode;
	var CssMode = require("./css").Mode;
	var Tokenizer = require("../tokenizer").Tokenizer;
	var FreeMarkerHighlightRules = require("./freemarker_highlight_rules").FreeMarkerHighlightRules;
	var MatchingBraceOutdent = require("./matching_brace_outdent").MatchingBraceOutdent;

	// TODO: pick appropriate fold mode
	var HtmlBehaviour = require("./behaviour/html").HtmlBehaviour;
	var HtmlFoldMode = require("./folding/html").FoldMode;

	var Mode = function() {
		// NOTE: borrowed from Html
		var highlighter = new FreeMarkerHighlightRules();
		this.$tokenizer = new Tokenizer(highlighter.getRules());
		this.$behaviour = new HtmlBehaviour();
		this.$outdent = new MatchingBraceOutdent();

		this.$embeds = highlighter.getEmbeds();
		this.createModeDelegates({
			"js-": JavaScriptMode,
			"css-": CssMode
				//      "freemarker-": FreeMarkerMode
		});

		this.foldingRules = new HtmlFoldMode();
	};
	oop.inherits(Mode, TextMode);

	(function() {
		// NOTE: borrowed from Liquid, doesn't seem to do anything
		this.toggleCommentLines = function(state, doc, startRow, endRow) {
			var outdent = true;
			var outentedRows = [];
			var re = /^(\s*)#/;

			for (var i = startRow; i <= endRow; i++) {
				if (!re.test(doc.getLine(i))) {
					outdent = false;
					break;
				}
			}

			if (outdent) {
				var deleteRange = new Range(0, 0, 0, 0);
				for (var i = startRow; i <= endRow; i++) {
					var line = doc.getLine(i);
					var m = line.match(re);
					deleteRange.start.row = i;
					deleteRange.end.row = i;
					deleteRange.end.column = m[0].length;
					doc.replace(deleteRange, m[1]);
				}
			} else {
				doc.indentRows(startRow, endRow, "#");
			}
		};

		this.getNextLineIndent = function(state, line, tab) {
			var indent = this.$getIndent(line);

			var tokenizedLine = this.$tokenizer.getLineTokens(line, state);
			var tokens = tokenizedLine.tokens;
			var endState = tokenizedLine.state;

			if (tokens.length && tokens[tokens.length - 1].type == "comment") {
				return indent;
			}

			if (state == "start") {
				var match = line.match(/^.*[\{\(\[]\s*$/);
				if (match) {
					indent += tab;
				}
			}

			return indent;
		};

		this.checkOutdent = function(state, line, input) {
			return this.$outdent.checkOutdent(line, input);
		};

		this.autoOutdent = function(state, doc, row) {
			this.$outdent.autoOutdent(doc, row);
		};
	}).call(Mode.prototype);

	exports.Mode = Mode;
});

问题

但是，当我执行 editor.setMode("ace/mode/freemarker"); 时，我只会收到此错误:

mode-freemarker.js:46 Uncaught TypeError: Cannot read property 'Mode' of undefined
    at mode-freemarker.js:46

也就是说，require javascript模式不能在这一行加载:

var JavaScriptMode = require("./javascript").Mode;

为什么这个文件 mode-javascript 没有通过 require 加载？

Answer 1

您还需要包括 freemarker_highlight_rules来自 ace 的文件和 html 模式。