web-dev-qa-db-ja.com

Requirejsを介して渡される未定義オブジェクト

Requirejsを使用して、WebアプリにJavaScriptをロードしています。問題は、モジュールに渡されるundefinedオブジェクトを取得していることです。このオブジェクトは、他のモジュールで使用すると、完全にインスタンス化されます。

OK、ここにセットアップがあります。俺の main.js起動時にrequirejsが実行されるファイル：

require.config({
    baseUrl: "/scripts",
    paths: {
        demographics: "Demographics/demographics",
        complaints: "Complaints/complaints",
    }
});

require(["templates", "demographics", "complaints", "crossDomain"], function (templates, demographics, complaints) {
    "use strict";

    console.log("0");
    console.log(demographics === undefined);

    demographics.View.display();
});

この問題では、多くの設定がコアファイルだけに削除されています。

Demographics.js：

define(["ko", "templates", "complaints", "globals", "underscore"], function (ko, templates, complaints, globals) {

    // Stuff removed.
    return {
        View: view
    };
});

およびComplaints.js

define([
    "demographics",
    "ko",
    "templates",
    "complaints",
    "visualeffects",
    "globals",
    "webservice",
    "underscore",
    "typewatcher",
    "imagesloaded"],
    function (demographics, ko, templates, complaints, visualeffects, globals, webservice) {
        "use strict";


        console.log("1");
        console.log(demographics === undefined);
    return {
        View: view
    };
});

問題はこれです-Complaints.jsdemographics configを介して渡されるdefineパラメーターはundefinedです。コンソールからログアウトすると、「人口統計=== undefined」はtrueであることがわかります。

ただし、main.jsファイルの実行時に渡されるdemographicsパラメーターは未定義ではなく、予想どおりインスタンス化されたオブジェクトです。

なぜcomplaints.jsその人口統計変数は未定義です。誰かが私が行方不明になっているものを見つけることができますか？

javascriptrequirejs
41
Jason Evans

循環依存関係があります。 demographicsモジュールはcomplaintsに依存し、complaintsはdemographicsに依存します。 ドキュメント ：

循環依存関係を定義する場合（aはbを必要とし、bはaを必要とします）、この場合、bのモジュール関数が呼び出されると、aの未定義値を取得します。

循環依存関係を削除できない場合の解決策は、2つのモジュールの一方をオンデマンドで他方に非同期的に要求することです（たとえば、ビューを定義するモジュールが実行されるときではなく、ビューがインスタンス化されるとき）。繰り返しますが、 docs はこのトピックをかなりよくカバーしています。

59
rharper

もう1つのケースは、モジュールを定義するときにrequireの代わりに誤ってdefineと入力した場合です。これに気づくまでに時間がかかりました。

28
Misha Reyzlin

同様の問題がありました。私の場合、モジュールを定義するときに、次のように書きました。

define('some_dependency', ...

の代わりに

define(['some_dependency'], ...
11
Joel

別の考えられる理由は、モジュールのインターフェース（AMD、CommonJS）を実装しているが、何も返さないことです。私はそれをやった。

4
LeeGee

私は別の理由に遭遇しました：

_define(function () {
    return {};
}()); // <-- notice the '()' typo.
_

この「タイプミス」は、このエラーに対してJSエラーを引き起こさず、特に多くの潜在的な循環依存関係がある複雑なアプリケーションで把握するのを混乱させる可能性があります。

もちろん、「typo」は、定義した関数を呼び出すだけの有効なJSであり、その結果、意図したとおりの関数ではなくdefine()に結果が渡されるためです。

1
Brad Allred

後知恵で明らかに見えるかもしれないもう1つの考えられる理由は、モジュールのコードのエラーです。私の場合、未定義の変数から属性を取得しようとしていました。エラーはコンソールに記録されますが、何らかの理由で、未定義のモジュールエラーとは見られず、見落としていました。

0
Sofia Paixão