Ace 编辑器“定义未定义”
Posted
技术标签:
【中文标题】Ace 编辑器“定义未定义”【英文标题】：Ace editor "define is not defined" 【发布时间】：2012-06-08 15:17:57 【问题描述】：我正在尝试将ace editor 添加到我的应用中。我从 github 下载了它，将“ace/lib/ace”目录放到了我的应用程序目录中，包括：
<script src="ace/lib/ace/ace.js" type="text/javascript" charset="utf-8"></script>"
在我的正文标签中：
editor = ace.edit "editor"
在我的脚本标签中。我尝试在 Chrome 和 Firefox 中加载页面，但在 ace.js:46 中出现“未定义定义”。 ace.js 中的行是：
define(function(require, exports, module)
有谁知道为什么 ace 期望 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>
【问题讨论】：
我也遇到了同样的问题...你有没有弄清楚？ 不，抱歉。我决定不值得我花时间。祝你好运。 事实证明，我只需要从 Git 页面下载一个包（zip 文件），而不是使用克隆的 repo（他们在 zip 中打包代码的方式略有不同文件）。所以，如果你决定再试一次，它是一个非常酷的编辑器。 同样的问题，zip在哪里下载？ 如果有人还在寻找它，链接在这里：github.com/ajaxorg/ace-builds 只需点击 ZIP 下载文件夹。 【参考方案1】：如果您已经有了源代码，那么仍然很容易做到。只需进入复制所有 ace 源的目录即可。
然后，做：
npm install
node Makefile.dryice.js
查看 wiki 了解更多详情 https://github.com/ajaxorg/ace/wiki/Building-ace
【讨论】：
谢谢。我忘了实际构建代码，您的评论提醒我这样做。哎呀。 ☺【参考方案2】：我通过将window.define = ace.define; 放入我的 DOMload 处理程序来破解它。
【讨论】：
【参考方案3】：您收到此错误是因为您的页面中未包含 RequireJS JavaScript 库。
要解决此问题，请使用 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>
【讨论】：
【参考方案4】：在 React 中，如果您要从 ace-builds 导入任何东西，那么您的导入顺序很重要。
应该是这样的
import AceEditor from 'react-ace';
import 'ace-builds/src-noconflict/mode-json';
不是这样的
import 'ace-builds/src-noconflict/mode-json';
import AceEditor from 'react-ace';
【讨论】：
【参考方案5】：您也可以使用 cdn
http://cdnjs.com/libraries/ace/ http://www.jsdelivr.com/#!ace并替换
<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>
【讨论】：
这并不能以任何方式解决问题以上是关于Ace 编辑器“定义未定义”的主要内容，如果未能解决你的问题，请参考以下文章