Question

我有一个已被优化为单个文件的requirejs项目，我正在同步加载。代码按预期加载，但模块仍然是异步加载（它们在加载过程的后期才可用）并且它导致一些遗留代码出现问题，我希望它可以使用。

根据下面的代码，在加载main-build之前，有没有办法让legacy_code.js的方法立即可用？

<script type="text/javascript" src="/scripts/vendor/require.js"></script>
<script type="text/javascript" src="/scripts/main-build.js"></script>

<!-- At this point, the code is set up and it will be invoked later -->
<!-- ...but the next file requires to access methods in the modules.-->

<script type="text/javascript" src="/script/legacy_code.js"></script>

如果最坏的情况发生，我可以编写自己的define()和require()版本（这也可以释放大量带宽，因为它需要做的就是编目并调用模块），但我希望有一种内置的方法来做到这一点。

Answer 1

在这里回答我自己的问题。看了很久之后，我看不到任何同步加载Requirejs代码或加载后立即调用模块的方法。所以我最终编写了一些代码来临时覆盖require和declare方法。它适用于我的用例，但如果其他人需要它可能需要更改。我相信它可以比现在更优化，但它确实有效。

您可以找到我将尝试维护的代码on GitHub。

此时的代码如下所示：

(function () {
    var self = {},
        originalDefine = window.define,
        originalRequire = window.require,
        modules = [];

    var define = function (id, deps, fn) {
        if (id !== 'requireLib' && id !== 'text') {
            modules.push({"id": id, "deps": deps, "fn": fn});
        }
    };



    var require = function (deps, fn) {
        var sortedModules = [],
            unsortedModules = [],
            resolvedDeps = {},
            maxAttempts = 1000,
            module,
            dep,
            depList,
            canAdd,
            i,
            j;

        unsortedModules = ([]).concat(modules);
        while (unsortedModules.length > 0 && --maxAttempts > 0) {

            for (i = unsortedModules.length - 1; i >= 0; i--) {
                canAdd = true;
                module = unsortedModules[i];

                for (j = 0; j < module.deps.length; j++) {
                    dep = module.deps[j];
                    if (resolvedDeps[dep] === undefined) {
                        canAdd = false;
                        break;
                    }
                }
                if (canAdd) {
                    resolvedDeps[module.id] = module;
                    sortedModules.push(unsortedModules.splice(i,1)[0]);
                }
            }
        }

        for (i = 0; i < sortedModules.length; i++) {
            module = sortedModules[i];
            depList = [];
            for (j = 0; j < module.deps.length; j++) {
                depList.push(resolvedDeps[module.deps[j]]);
            }
            resolvedDeps[module.id] = module.fn.apply(this, depList);
        }

        depList = [];
        for (i = 0; i < deps.length; i++) {
            depList.push(resolvedDeps[deps[i]]);
        }

        fn.apply(this, depList);

        window.define = originalDefine || function () {};
        window.require = originalRequire || function () {};
    };

    window.define = define;
    window.require = require;
    window.require.config = function() {};

    return self;
} ());

Answer 2

执行此操作的最简单方法，无需覆盖define()和require()，肯定只需要wrap your legacy code in an AMD并将main-build.js模块定义指定为依赖项。

我知道技术上不是'同步'，但它应该实现你想要的 - 只有在加载了需要的模块之后才会调用遗留代码。

Answer 3

如果您使用jQuery.ajax（）函数使用Jquery和一些服务器端函数，则默认调用是异步的。

http://api.jquery.com/jQuery.ajax/

您可以在jQuery.ajax（）函数中设置async：false。

希望这会有所帮助。

同步使用requirejs

3 个答案: