4

我正在尝试使用 requireJS，但我想构建依赖关系的层次结构：main需要obr.platcom和obr.platcom需要obr（例如）。

我有这个文件层次结构：

- index.html
-> js
   - main.js
   -> lib
      - jquery.js
      - require.js
   -> obr [my own 'libraries']
      - obr.js
      - obr.platcom.js

索引.html

<!DOCTYPE html>
<html lang="es">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta name="viewport" content="initial-scale=1.0, width=device-width" />
        <title>Platcom</title>
        <script type="text/javascript" src="js/lib/jquery.js"></script>
        <script data-main="js/main" src="js/lib/require.js"></script>
    </head>
    <body>
    </body>
</html>

main.js

$(document).ready(function() {
    require(["obr/obr.platcom"], function() {
        obr.hola();
        var myPlatcom = obr.platcom();
        myPlatcom.test();
    });
});

obr.js

var obr = {};
obr.hola = function() {
    alert('Hola OBR');
};

obr.platcom.js

require(["obr.js"],function() {
    obr.platcom = function(params) {
        var that = {};

        var test = function test() {
            alert('Hola Platcom!');
        }

        that.test = test;
        return that;
    }
});

如果我在所有作品中都需要obr和obr.platcom文件main，但如果我使用这种嵌套样式，我会收到下一个错误：

Uncaught ReferenceError: obr is not defined       main.js:3

你知道我做错了什么吗？先感谢您。

4

1 回答 1

8

好吧，你做错了几件事。

  1. 您需要将要注入的依赖项指定为参数。例如，除非您指定如何调用所需的模块，require(["obr/obr.platcom"], function() {否则不会做太多事情。你应该需要这个：

    require(["obr/obr.platcom"], function( obr ) {

    这样，您就知道所需对象在哪个变量中。

  2. obr.js变量在全局范围内。您需要将它们包装在requireordefine函数调用中。以下将起作用：

    define(function() {
    var obr = {};
    obr.hola = function() {};
    return obr;
});

    您可能已经注意到上一个文件存在一些问题。

  3. 如果你希望你的模块被导入到某个地方，你必须定义它。所以你必须使用这个define功能，而不是那个require。并且该define函数必须返回一个对象。这是一个固定的obr.platcom.js文件：

    // If you don't use "define" for the obr.js file too, this won't work
define(['obr'], function( obr ) {
    obr.platcom = function() {};

    // Don't forget to return the obr object, or the require of
    // the main file won't return anything
    return obr;
});

这样，事情就以正确的方式完成了。或者至少，require.js 希望你做事的方式。

我希望这能告诉你如何有效地使用 require.js 来轻松地将你的代码分离到模块中:)

于 2012-05-23T12:04:01.813 回答