jQuery 不匹配的匿名定义（）模块
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15371918/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Mismatched anonymous define() module
提问by Adonis K. Kakoulidis
I'm getting this error when I browse my webappfor the first time (usually in a browser with disabled cache).
当我第一次浏览我的web 应用程序时（通常在禁用缓存的浏览器中），我收到此错误。
Error: Mismatched anonymous define() module: function (require) {
错误：不匹配的匿名定义（）模块：函数（需要）{
HTML:
HTML:
<html>
.
.
.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script> var require = { urlArgs: "v=0.4.1.32" }; </script>
<script data-main="assets/js/main" src="assets/js/libs/require.js"></script>
<script src="assets/js/ace/ace.js?v=0.4.1.32"></script>
</body>
</html>
JS:
JS：
$(function () {
define(function (require) {
// do something
});
});
Anyone know exactly what this error means and why its happening?
任何人都知道这个错误的确切含义以及它为什么会发生？
source file, a short discussionabout it in the github issues page
回答by B T
Like AlienWebguy said, per the docs, require.js can blow upif
就像 AlienWebguy 说的，根据文档，require.js 可能会崩溃，如果
- You have an anonymous define ("modules that call define() with no string ID") in its own script tag (I assume actually they mean anywhere in global scope)
- You have modules that have conflicting names
- You use loader plugins or anonymous modules but don't use require.js's optimizer to bundle them
- 您在自己的脚本标签中有一个匿名定义（“调用没有字符串 ID 的define() 的模块”）（我假设它们实际上是指全局范围内的任何地方）
- 您有名称冲突的模块
- 您使用加载器插件或匿名模块，但不要使用 require.js 的优化器来捆绑它们
I had this problem while including bundles built with browserify alongside require.js modules. The solution was to either:
我在包含使用 browserify 构建的包和 require.js 模块时遇到了这个问题。解决方案是：
A. load the non-require.js standalone bundles in script tags beforerequire.js is loaded, or
A. 在加载 require.js之前加载脚本标签中的非 require.js 独立包，或
B. load them using require.js (instead of a script tag)
B. 使用 require.js（而不是脚本标签）加载它们
回答by eloone
I had this error because I included the requirejs file along with other librairies included directly in a script tag. Those librairies (like lodash) used a define function that was conflicting with require's define. The requirejs file was loading asynchronously so I suspect that the require's define was defined after the other libraries define, hence the conflict.
我有这个错误，因为我包含了 requirejs 文件以及直接包含在脚本标签中的其他库。那些库（如 lodash）使用了一个与 require 的定义相冲突的定义函数。requirejs 文件是异步加载的，所以我怀疑 require 的定义是在其他库定义之后定义的，因此存在冲突。
To get rid of the error, include all your other js files by using requirejs.
要消除错误，请使用 requirejs 包含所有其他 js 文件。
回答by P.Brian.Mackey
In getting started with reactjs I ran into the issue and as a beginner the docsmay as well been written in greek.
在开始使用 reactjs 时，我遇到了这个问题，作为初学者，文档也可能是用希腊语编写的。
The issue I ran into was that most of the beginner examples use "anonymous defines" when you should be using a "string id".
我遇到的问题是，当您应该使用“字符串 ID”时，大多数初学者示例都使用“匿名定义”。
anonymous defines
匿名定义
define(function() {
return { helloWorld: function() { console.log('hello world!') } };
})
define(function() {
return { helloWorld2: function() { console.log('hello world again!') } };
})
define with string id
用字符串 id 定义
define('moduleOne',function() {
return { helloWorld: function() { console.log('hello world!') } };
})
define('moduleTwo', function() {
return { helloWorld2: function() { console.log('hello world again!') } };
})
When you use define with a string idthen you will avoid this error when you try to use the modules like so:
当您使用带有字符串 id 的定义时，当您尝试使用像这样的模块时，您将避免此错误：
require([ "moduleOne", "moduleTwo" ], function(moduleOne, moduleTwo) {
moduleOne.helloWorld();
moduleTwo.helloWorld2();
});
回答by AlienWebguy
Per the docs:
根据文档：
If you manually code a script tag in HTML to load a script with an anonymous define() call, this error can occur.
Also seen if you manually code a script tag in HTML to load a script that has a few named modules, but then try to load an anonymous module that ends up having the same name as one of the named modules in the script loaded by the manually coded script tag.
Finally, if you use the loader plugins or anonymous modules (modules that call define() with no string ID) but do not use the RequireJS optimizer to combine files together, this error can occur. The optimizer knows how to name anonymous modules correctly so that they can be combined with other modules in an optimized file.
To avoid the error:
Be sure to load all scripts that call define() via the RequireJS API. Do not manually code script tags in HTML to load scripts that have define() calls in them.
If you manually code an HTML script tag, be sure it only includes named modules, and that an anonymous module that will have the same name as one of the modules in that file is not loaded.
If the problem is the use of loader plugins or anonymous modules but the RequireJS optimizer is not used for file bundling, use the RequireJS optimizer.
如果您在 HTML 中手动编写脚本标记以使用匿名 define() 调用加载脚本，则可能会发生此错误。
如果您在 HTML 中手动编写脚本标记以加载具有几个命名模块的脚本，然后尝试加载一个匿名模块，该模块最终与手动加载的脚本中的一个命名模块具有相同的名称，也可以看到编码脚本标签。
最后，如果您使用加载器插件或匿名模块（调用没有字符串 ID 的 define() 的模块）但不使用 RequireJS 优化器将文件组合在一起，则可能会发生此错误。优化器知道如何正确命名匿名模块，以便它们可以与优化文件中的其他模块组合。
为避免错误：
确保通过 RequireJS API 加载所有调用 define() 的脚本。不要在 HTML 中手动编写脚本标记以加载其中包含 define() 调用的脚本。
如果您手动编写 HTML 脚本标记，请确保它仅包含命名模块，并且未加载与该文件中的模块之一具有相同名称的匿名模块。
如果问题是使用加载器插件或匿名模块，但 RequireJS 优化器未用于文件捆绑，请使用 RequireJS 优化器。
回答by Vector
Be aware that some browser extensions can add code to the pages. In my case I had an "Emmet in all textareas" plugin that messed up with my requireJs. Make sure that no extra code is beign added to your document by inspecting it in the browser.
请注意，某些浏览器扩展程序可以向页面添加代码。就我而言，我有一个“所有文本区域中的 Emmet”插件，它与我的 requireJs 混淆。通过在浏览器中检查文档，确保没有额外的代码被添加到您的文档中。
回答by jcbdrn
The existing answers explain the problem well but if including your script files using or before requireJS is not an easy option due to legacy code a slightly hacky workaround is to remove require from the window scope before your script tag and then reinstate it afterwords. In our project this is wrapped behind a server-side function call but effectively the browser sees the following:
现有的答案很好地解释了这个问题，但是如果由于遗留代码，使用 requireJS 或在 requireJS 之前包含脚本文件不是一个简单的选择，那么稍微有点hacky 的解决方法是在脚本标记之前从窗口范围中删除 require，然后在之后恢复它。在我们的项目中，这被包装在服务器端函数调用之后，但实际上浏览器会看到以下内容：
<script>
window.__define = window.define;
window.__require = window.require;
window.define = undefined;
window.require = undefined;
</script>
<script src="your-script-file.js"></script>
<script>
window.define = window.__define;
window.require = window.__require;
window.__define = undefined;
window.__require = undefined;
</script>
Not the neatest but seems to work and has saved a lot of refractoring.
不是最整洁的，但似乎有效并且节省了很多折射。
回答by Umar Asghar
Or you can use this approach.
或者您可以使用这种方法。
- Add require.js in your code base
- then load your script through that code
- 在您的代码库中添加 require.js
- 然后通过该代码加载您的脚本
<script data-main="js/app.js" src="js/require.js"></script>
<script data-main="js/app.js" src="js/require.js"></script>
What it will do it will load your script after loading require.js.
它将在加载 require.js 后加载您的脚本。
