4

requireJSを使用しようとしていますが、依存関係の階層を構築したいと思います：mainrequiresobr.platcomとobr.platcomrequires obr（たとえば）。

私はこのファイルの階層を持っています：

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

index.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変数はグローバルスコープにあります。requireまたはdefine関数呼び出しでそれらをラップする必要があります。以下が機能します。

    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 に答える