Question

我正在尝试使用RequireJS加载Parse JS（parse.com）和Bootstrap JS。我无法使用这些库，但其他库似乎工作正常（例如backbone.js）。

我已确保将其包含在我的index.html文件中：

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

我的main.js文件是这样的：

require.config({
  paths: {
    jquery: 'libs/jquery/jquery-min',
    underscore: 'libs/underscore/underscore-min',
    backbone: 'libs/backbone/backbone-min',
    bootstrap: 'libs/bootstrap/bootstrap-min',
    parse: 'libs/parse/parse-min',
    templates: '../templates'
  }

});

require([
  // Load our app module and pass it to our definition function
  'app',

], function(App){
  // The "app" dependency is passed in as "App"
  // Again, the other dependencies passed in are not "AMD" therefore don't pass a parameter to this function
  App.initialize();
});

最后我的app.js是：

// Filename: app.js
define([
  'jquery', 
  'underscore', 
  'parse',
  'bootstrap',
  'router' // Request router.js
], function($, _, Parse, Bootstrap, Router){
  var initialize = function(){
    *console.log(Parse);*
    // Pass in our Router module and call it's initialize function
    Router.initialize();
  };

  return { 
    initialize: initialize
  };
});

如果这里是我的文件结构：

/* File Structure
├── js
│   ├── libs
│   │   ├── jquery
│   │   │   ├── jquery-min.js
│   │   ├── backbone
│   │   │   ├── backbone-min.js
│   │   └── underscore
│   │   │   ├── underscore-min.js
│   │   └── parse
│   │   │   ├── parse-min.js
│   │   └── bootstrap
│   │   │   ├── bootstrap-min.js
│   │   └── require
│   │   │   ├── require.js
│   ├── router.js
│   ├── app.js
│   ├── main.js  // Bootstrap
│   └── text.js  //Require.js plugin
└── index.html

我看到我的用于parse / bootstrap的JS文件正由firebug控制台选项卡中的浏览器加载，但是app.js中的console.log语句返回null。当我打印Router，_或$时，它们不为空。

我在这里做错了什么？有什么指针吗？谢谢！

Answer 1

对于非AMD文件，您需要使用shim config。由于parse-min通过全局变量＆＃39; Parse＆＃39;导出它的功能，你需要在shim config中指定全局变量名，如下所示。由于bootstrap不会导出特定的全局变量，因此您可以使用它的任何插件全局变量，例如$ .fn.popover。

有关shim配置的更多信息，请阅读：http://requirejs.org/docs/api.html#config-shim

require.config({
  paths: {
    jquery: 'libs/jquery/jquery-min',
    underscore: 'libs/underscore/underscore-min',
    backbone: 'libs/backbone/backbone-min',
    bootstrap: 'libs/bootstrap/bootstrap-min',
    parse: 'libs/parse/parse-min',
    templates: '../templates'
  },
  shim: {
     parse: {
        exports: 'Parse',
        deps: ["jquery"]
     },
     bootstrap: {
        exports: '$.fn.popover',
        deps: ["jquery"]
     },
     backbone: {
        deps: ['underscore', 'jquery'],
        exports: 'Backbone'
     }, 
     underscore: {
        exports: '_'
     }, 
     jquery: {
        exports: '$'
     }
  }

});

对于bootstrap和parse，require.js加载的模块为null

1 个答案: