Question

当我访问绝大多数网站时，打开控制台并粘贴以下代码：

(function(global, appName, app) {
    if (typeof define === "function" && typeof define.amd === "object") {
        console.log("AMD/RequireJS");
        define(app);
        console.log("defined app");
    } else if (typeof module !== "undefined") {
        console.log("CommonJS");
        module.exports = app(global);
        console.log("defined with module.exports");
    } else {
        console.log("Browser");
        global[appName] = app(global);
        console.log("defined as global");
    }
})(this, "App", function(global) {
    "use strict";
    console.log("defining getThis");
    function getThis() {
        console.log('i got it!');
    }
    return {
        getThis: getThis
    };
});
console.log("finished IIFE");
App.getThis();

我得到以下输出：

Browser
defining getThis
defined as global
finished IIFE
i got it!

如果我将相同的代码粘贴到使用RequireJS的网站的控制台中，例如www.bestbuy.com或www.homedepot.com，它将失败，并显示以下输出：

AMD/RequireJS
defined app
finished IIFE
Uncaught ReferenceError: App is not defined at <anonymous>:27:1

我尝试将行define(app);更改为define(['App'], app);无效。

我已经搜索和散布了好几个小时了，这真是机智。我以为UMD模式就是通用的，因此得名。有什么作用？

Answer 1

好吧，这完全取决于您将如何使用脚本。如果您知道要在没有RequireJS的浏览器中使用脚本，则可以按测试方式使用。

App.getThis();

因为它在全局对象中，对于浏览器，window。

但是，如果您知道存在RequireJS，则需要require您的应用。

require(["App"], function(App){
    App.getThis();
});

如果NodeJS

const App = require('App');

但是我还没有测试过这个。

此外，我建议您将define(app);更改为define(appName, app);

希望有帮助

使用RequireJS的网站上的UMD无法正常工作？

1 个答案: