3

RequireJS optimizerを使用して、2 つの require amd モジュールを 1 つの combined.js javascript ファイルに結合しようとしています。

**この質問は、この質問と同じではありません:問題の解決策や詳細な説明がなく、reactJS のドキュメントに矛盾するアドバイスがいくつかある、Mismatched anonymous define() モジュール。

module1.js

//module1.js - objectTest1
(function (root, factory) {
    'use strict';

    //Universal Module Definition
    if (typeof define === 'function' && define.amd) {
        // AMD
        define(factory);
    } else if (typeof exports === 'object') {
        // Node, CommonJS-like
        module.exports = factory();
    } else {
        // Browser globals (root is window)
        root.returnExports = factory();
    }
}(this, function () {
    'use strict';

     return function objectTest1() {
          var test = '1';
          return test;
        }
}));

module2.js

//module2.js - objectTest2
(function (root, factory) {
    'use strict';

    //Universal Module Definition
    if (typeof define === 'function' && define.amd) {
        // AMD
        define(factory);
    } else if (typeof exports === 'object') {
        // Node, CommonJS-like
        module.exports = factory();
    } else {
        // Browser globals (root is window)
        root.returnExports = factory();
    }
}(this, function () {
    'use strict';

     return function objectTest2() {
          var test = '2';
          return test;
        }
}));

推奨されるグッド プラクティス

requireJS wiki およびその他のソースでは、各モジュールに名前を設定するのではなく、ID なしで匿名のままにしておくことをお勧めします: https://github.com/requirejs/requirejs/wiki/Updating-existing -libraries#anon

"通常、名前付きモジュールを登録するのではなく、匿名モジュールとして登録する必要があります... "

RequireJS オプティマイザー - モジュールを 1 つの js ファイルにまとめる

【build.js】

({
    baseUrl: ".",
    paths: {
        "module1": "module1.js",
        "module2":"module2.js"
    },
    name: "definition",
    out: "combined.js"
})

[定義.js]

require(["module1", "module2"], function (objectTest1, objectTest2) {
});

【requireJSオプティマイザーを吐き出す】

./node_modules/requirejs/bin/r.js -o build.js optimize=none

RequireJS オプティマイザー - 出力 - combined.js

(function (root, factory) {
    'use strict';

    //Universal Module Definition
    if (typeof define === 'function' && define.amd) {
        // AMD
        define(factory);
    } else if (typeof exports === 'object') {
        // Node, CommonJS-like
        module.exports = factory();
    } else {
        // Browser globals (root is window)
        root.returnExports = factory();
    }
}(this, function () {
    'use strict';

    return function objectTest1() {
        var test = '1';
        return test;
    }
}));
define("module1", function(){});

(function (root, factory) {
    'use strict';

    //Universal Module Definition
    if (typeof define === 'function' && define.amd) {
        // AMD
        define(factory);
    } else if (typeof exports === 'object') {
        // Node, CommonJS-like
        module.exports = factory();
    } else {
        // Browser globals (root is window)
        root.returnExports = factory();
    }
}(this, function () {
    'use strict';

    return function objectTest2() {
        var test = '2';
        return test;
    }
}));
define("module2", function(){});

require(["module1", "module2"], function (objectTest1, objectTest2) {
});
define("combined_name", function(){});

結合された.jsファイルとモジュールを読み込もうとしています

[index.html]

require(["combined_name"], 
        function (combined_name, objectTest1, objectTest2) {
           //combined_name = undefined
           //one of the objects is found, the other is undefined (error)
        }
);

問題

結合された.jsファイルをロードするとき、コードで上記の各モジュールのID名を指定しない限り、常に同じエラーが発生します: define('module1', factory); ...

エラー：

Uncaught Error: Mismatched anonymous define() module: function () {
    'use strict';

    return function objectTest1() {

追加情報

  • すべてのファイルは現在、その UMD パターンを使用して requireJS で完全にロードされています。ただし、何かを変更する必要があるかどうかはわかりません。
  • definition.js と combined.js は、モジュールごとに定義されたID 名を持つモジュールを明示的にロードしています。問題はここにあるかもしれません。

質問

  1. これらの匿名モジュールを1つの結合された.jsファイルに結合し、そのファイルをrequireJSでロードしてからモジュールを取得するにはどうすればよいですか?
  2. コードに何か問題がある可能性がありますか？
  3. requireJS オプティマイザーのドキュメントでは、匿名モジュールのロードをサポートしていると書かれていますが、私はそれを実行できませんでした。モジュールにID名を割り当てずにそれを行うことは本当に可能ですか?

私はそれを解決しようとして完全に絶望的になり、すでに多くのリソースを調べましたが、明確な答えを見つけることができませんでした. どうもありがとう

4

0 に答える 0