requirejs config给出ReferenceError：无法找到变量$

也许我从根本上误解了requirejs config的工作方式，但我认为我的配置使得一些库是全局的，所以我可以在其他文件中使用它们，而只需要和定义文件我需要在个人脚本中使用。然而，我不能在我的应用程序代码中引用$（jQuery），而没有得到指示它不是全局访问的引用错误。我已经将问题隔离到了下面的简单示例。

我的文件设置如下：

test 
    | 
    |-index.html 
    |-TestApp.js 
    |-MainApp.js 
    |-lib 
    | |-require.js 
    | |-jquery.js 
    | |-loadash.js 
    | |-backbone.js 
    |-css 
    |-test.css

库文件版本RequireJS 2.1.22和jQuery 2.0.3，Loadash 3.10.1和骨干1.2.1。我只是试图设置我的环境，我采取的方法是将我的TestApp.js文件传递给require.js以加载所需的文件并在MainApp.js中引导应用程序代码。 index.html中的脚本如下：

<!DOCTYPE html> 
<html> 
    <head> 
    <link rel='stylesheet' type='text/css' href='css/test.css'/> 
    </head> 
    <body> 
     <div></div> 
     <script src="./lib/require.js" type="text/javascript" data-main="./TestApp.js"></script> 
    </body> 
</html>

引用的CSS脚本文件简单地确保了DIV是一个橙色的正方形可见。见下：

div { 
    height: 100px; 
    width: 100px; 
    background-color: #FA6900; 
    border-radius: 5px; 
    }

这是index.html中的脚本行，然后通过将我的配置文件传递给requirejs来启动应用程序代码。这是TestApp.js作为data-main传递的。该TestApp.js是在这里：

require.config({ 
    paths: { 
      'jquery': 'lib/jquery', 
      'lodash': 'lib/lodash', 
      'backbone': 'lib/backbone' 
      }, 

    map: { 
      '*': { 
        // Backbone requires underscore. This forces requireJS to load lodash instead: 
        'underscore': 'lodash' 
        } 
      }, 

    shim: { 
      jquery:   {exports: '$'}, 
      underscore:  { 
          deps:  ['jquery'], 
          exports: '_' 
          }, 
      backbone:  { 
          deps:  ['underscore'], 
          exports: 'Backbone' 
          }, 

      TestApp:  { 
          deps:  ['backbone'], 
          exports: 'TestApp' 
          } 
      } 
    }); 

require(['MainApp'], function(MainApp) { 
    MainApp.run(); 
    });

上述引用的文件库文件我想用，我再重新映射loadash需要下划线时要加载的路径（我需要一些额外的loadash能力），然后我使用shim来确保文件加载时依赖性是正确的。将此配置文件传递给index.html中的require.js似乎正在工作，因为所有文件都显示为在我的浏览器中加载。然而，问题似乎是，他们似乎并不像我想的那样是全球可访问的。

在配置部分之后，最后一个require调用加载MainApp.js文件并调用暴露的运行函数。该MainApp.js看起来是这样的：

define(function(require) { 

    var run = function() { 

       $(document).ready(function() { 
        $('div').click(function() { 
         $('div').fadeOut('slow'); 
         }); 
        }); 
       }; 

    return { 
      run: run 
      }; 
    });

至于我明白我不应该需要要求我已经在需要配置提到的文件，我认为他们应该被加载并提供此代码。这是我误解了正在发生的事情或错过了一步的地方。暴露run函数被调用，但调用$第一行引发错误：

ReferenceError: Can't find variable: $

所以我的问题是：

我有什么错我的思想？
（或）我做错了什么？
我应该为了预先加载并提供经常引用的库可以这样做，我并不需要要求和在每一个文件我已经定义呢？

来源

2016-02-26 JavaDevGuy

您需要在其中使用'$'，而不只是在代码的另一部分中......您可以将它们作为参数传递给'MainApp.run（$，global2，...）' – dandavis

@Louis让我意识到我在上面做的事情中的错误。在TestApp.js更换垫片，这样是写着：

MainApp: { 
     deps:  ['backbone'], 
     exports: 'MainApp' 
     }

更正的问题，现在骨干，$和_都是提供给我的应用程序代码的其余部分不会搞乱每个文件需要。即我并不需要开始的每一个文件与：

define (['lib/jquery', 'lib/loadash', 'lib/backbone'], function($, _ , Backbone) {

考虑到我的实际应用程序共同DEPS列表是相当大的，这意味着我只需要定义本地使用的资源，可以从一个位置控制的路径。

来源

2016-02-26 17:16:42 JavaDevGuy

As far as I understood I should not need to require the files I already mentioned in the require config, I thought they should be loaded and available to this code.

您误会了RequireJS的工作原理。您应该从头到尾阅读documentation。现在，这里是你应该改变的事情。

如果您需要jquery您MainApp模块：

define(function(require) { 
    var $ = require("jquery");

您应该删除您shim是你们等有jquery，underscore和backbone，因为他们所有的呼叫define和shim仅供代码不调用define。我不知道TestApp是什么，但如果它是你自己的代码，你真的应该把它变成一个适当的AMD模块，并删除shim。

来源

2016-02-26 00:51:18 Louis

您的问题是什么TestApp是什么触发了一分钱下降，我已经意识到我在上面的错误。回答你的问题TestApp是包含require配置的文件。 MainApp是包含代码的文件（稍后启动整个应用程序）。更改垫片的最后一位状态： 'MainApp：{deps：['backbone']}'' 解决了这个问题，我不需要在随后的应用程序代码中需要jQuery，它可以在全球范围内使用并且真正清理我的应用程序代码。 – JavaDevGuy

我已经添加了一个完整的答案，谁打这个问题，然后他们可以看到错误是什么。 – JavaDevGuy

requirejs config给出ReferenceError：无法找到变量$

回答

相关问题