140

当我第一次浏览我的web 应用程序时（通常在禁用缓存的浏览器中），我收到了这个错误。

错误：不匹配的匿名定义（）模块：函数（需要）{

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：

$(function () {
    define(function (require) {
        // do something
    });
});

任何人都知道这个错误的确切含义以及它为什么会发生？

源文件，关于它的简短讨论在 github 问题页面

4

8 回答 8

149

就像 AlienWebguy 所说，根据文档，如果出现 require.js 可能会爆炸

  • 您在自己的脚本标签中有一个匿名定义（“调用define（）且没有字符串ID的模块”）（我假设它们实际上是指全局范围内的任何地方）
  • 您的模块名称冲突
  • 您使用加载器插件或匿名模块，但不使用 require.js 的优化器来捆绑它们

我在包含使用 browserify 构建的捆绑包和 require.js 模块时遇到了这个问题。解决方案是：

A. 在加载 require.js之前，在 script 标签中加载 non-require.js 独立包，或者

B. 使用 require.js（而不是脚本标签）加载它们

于 2014-05-05T07:28:51.733 回答
17

在开始使用 require.js 时，我遇到了这个问题，作为初学者，文档也可以用希腊语编写。

我遇到的问题是，当您应该使用“字符串 id”时，大多数初学者示例都使用“匿名定义”。

匿名定义

define(function() {
        return { helloWorld: function() { console.log('hello world!') } };
 })
    
  
define(function() {
        return { helloWorld2: function() { console.log('hello world again!') } };
 })

用字符串 id 定义

define('moduleOne',function() {
    return { helloWorld: function() { console.log('hello world!') } };
})

 define('moduleTwo', function() {
      return { helloWorld2: function() { console.log('hello world again!') } };
})

当您使用带有字符串 id 的定义时，当您尝试使用如下模块时，您将避免此错误：

require([ "moduleOne", "moduleTwo" ], function(moduleOne, moduleTwo) {
    moduleOne.helloWorld();
    moduleTwo.helloWorld2();
});
于 2016-10-14T00:59:25.900 回答
15

我遇到了这个错误，因为我包含了 requirejs 文件以及直接包含在脚本标记中的其他库。这些库（如 lodash）使用了与 require 的定义冲突的定义函数。requirejs 文件是异步加载的，所以我怀疑 require 的定义是在其他库定义之后定义的，因此发生了冲突。

要消除错误，请使用 requirejs 包含所有其他 js 文件。

于 2014-08-11T21:58:19.610 回答
12

根据文档：

如果您在 HTML 中手动编写脚本标记以通过匿名 define() 调用加载脚本，则可能会发生此错误。

如果您在 HTML 中手动编写脚本标记以加载具有几个命​​名模块的脚本，然后尝试加载最终与手动加载的脚本中的命名模块之一具有相同名称的匿名模块，也可以看到编码的脚本标签。

最后，如果您使用加载器插件或匿名模块（调用 define() 且没有字符串 ID 的模块）但不使用 RequireJS 优化器将文件组合在一起，则可能会发生此错误。优化器知道如何正确命名匿名模块，以便它们可以与优化文件中的其他模块组合。

为避免错误：

  • 确保通过 RequireJS API 加载所有调用 define() 的脚本。不要在 HTML 中手动编写脚本标记来加载其中包含 define() 调用的脚本。

  • 如果您手动编写 HTML 脚本标记，请确保它仅包含命名模块，并且不会加载与该文件中的模块之一同名的匿名模块。

  • 如果问题是使用加载器插件或匿名模块但 RequireJS 优化器未用于文件捆绑，请使用 RequireJS 优化器。

于 2013-03-12T20:55:39.527 回答
7

现有的答案很好地解释了这个问题，但是如果由于遗留代码而使用 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>

不是最整洁的，但似乎可以工作并且节省了很多折射。

于 2015-11-10T17:22:12.197 回答
5

请注意，某些浏览器扩展可以向页面添加代码。就我而言，我有一个“所有文本区域中的 Emmet”插件，它弄乱了我的 requireJs。通过在浏览器中检查文档，确保没有额外的代码被添加到您的文档中。

于 2015-04-28T19:24:30.963 回答
2

或者您可以使用这种方法。

  • 在你的代码库中添加 require.js
  • 然后通过该代码加载您的脚本

<script data-main="js/app.js" src="js/require.js"></script>

它会在加载 require.js 后加载你的脚本。

于 2019-04-04T14:14:02.793 回答
0

对于基于require.js. 如https://requirejs.org/docs/errors.htmlMISMATCHED ANONYMOUS DEFINE() MODULES中所述，此错误有多种原因，在我的案例中有趣的是：. 事实证明，编译器习惯于在构建期间合并/缩小 Javascript 代码。解决方案是删除编译器，而是使用's 优化器 ( ) 来合并 js 文件。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 optimizerGoogle ClosureGoogle closurerequire.jsr.js

于 2021-02-03T12:40:14.193 回答