Question

当我使用requirejs和backbonejs进行开发时，我对导入机制的工作方式感到困惑，因为我认为导入的类只适用于该功能范围。但是，当我尝试调试时，我发现了一些我没有导入jquery或者主干或下划线的requirejs类，它仍然能够正常工作，但这不适用于我创建的其他类。

以下示例说明了我的意思：

1）index.html - ＆gt;初始加载文件

2）init.js - ＆gt;导入所有必需的类并输出该类是否可用

3）base.js - ＆gt;基类，导入所有必需的库

4）shop.js - ＆gt;从基类扩展，没有导入jquery，骨干文件，但它正在工作

的index.html

<html>
<head>
    <title>Testing</title>
    <script data-main='init' src='http://requirejs.org/docs/release/2.0.4/minified/require.js'></script>
</head>
<body>
    halo world
</body>
</html>

init.js

require.config({
    paths: {
        jquery: 'http://code.jquery.com/jquery-1.7.2.min',
        underscore: 'http://underscorejs.org/underscore-min', 
        backbone: 'http://backbonejs.org/backbone-min'
    },
    shim: {
        backbone: {
            deps: ["underscore", "jquery"],
            exports: "Backbone"
        },

        underscore: {
            exports: "_"
        }
    }
});

require([
    'views/shop',
],function(ShopView){   
    var shopView = new ShopView();
    shopView.render();  

    console.log('Backbone - ');
    console.log(Backbone);
    console.log('Underscore - ');
    console.log(_);
    console.log('jQuery - ');
    console.log($);
    console.log('BaseView - ');
    console.log(BaseView);
});

shop.js

define([
    'views/base'
], function(BaseView) { 
    var ShopView = BaseView.extend({
        initialize:function(){
            console.log('ShopView');        
        }
    });
    return ShopView;
});

base.js

define([
    'jquery',
    'underscore',
    'backbone'  
], function($,_,Backbone) { 
    var BaseView = Backbone.View.extend({
        initialize:function(){
            console.log('BaseView');        
        }
    });
    return BaseView;
});

init.js的结果输出：

的console.log（主链）; - ＆GT;即使我没有导入它，也会返回骨干类

的console.log（$）; - ＆GT;返回我的jquery类，即使我没有导入它

的console.log（_）; - ＆GT;返回下划线类，即使我没有导入它

的console.log（基本视角）; - ＆GT;为我的自定义类返回undefined

如果我从init.js中删除了views / shop。

require([

],function(){   
    console.log('Backbone - ');
    console.log(Backbone);
    console.log('Underscore - ');
    console.log(_);
    console.log('jQuery - ');
    console.log($);
    console.log('BaseView - ');
    console.log(BaseView);
});

的console.log（主链）; - ＆GT;未定义

的console.log（$）; - ＆GT;破

的console.log（_）; - ＆GT;破

的console.log（基本视角）; - ＆GT;破

我无法解释以前的场景如何工作，我认为骨干，jquery，下划线是全局变量，但似乎我删除了视图类，然后变量未定义，而如果它是导入类，我可以提前我之前从base.js导入的类到将来导入的类。对不起，如果它困惑。

有人可以了解一下requirejs中的导入是如何工作的以及导入的范围。我是否必须重新要求我之前需要的课程。

Answer 1

require.config它没有自己导入任何东西。它用于声明非AMD文件的别名（路径）和依赖关系。

请注意，当您使用'define'时，您实际上需要其依赖项。

define ([ array of dependencies ], function)

init: require shop  (ok, let's bring shop here:
shop: require base  (ok, let's bring base here:
base: require    (so you need backbone, underscore and jquery.. ok,  
                  I'll bring them for you)

然后，当需要并加载每个依赖项时，init执行开始。

从shop移除init.js,时，您不需要任何内容。同样 require.config不会导入任何内容。

PS。这是个人品味，但是我更喜欢有一个app.js文件，其中需要jquery，下划线和主干。然后每个模块都需要'app'。如果要向其添加函数，共享该命名空间也很有用。（app.myFunction）

请参阅此主干poilerplate：https://github.com/tbranyen/backbone-boilerplate

RequireJS - 我是否必须为子类重新导入以前需要的文件

1 个答案: