Requirejs 和外部脚本答案

【问题标题】：Requirejs and external scriptsRequirejs 和外部脚本
【发布时间】：2014-07-08 19:00:41
【问题描述】：

您好，我有一个使用 requirejs 构建的 js 应用程序。现在我有来自其他开发人员的外部页面，他可以加载他的脚本、html、css 和其他与我无关的东西。这是我的模块将连接到他的页面的示例：

require(['page', 'widgetGame', 'adDynamic'], function (Page, WidgetGame, AdDynamic) {
    function PageExternalGame (params) {
        var params = params || {}; 
        Page.call(this, params); // call super constructor.
    };

    PageExternalGame.prototype.gameLoadingComplete = function() {
        alert(111);
    };

    window.yepiExternalPageGame = new PageExternalGame();
    return PageExternalGame;
});

这里是他的页面示例：

<!DOCTYPE HTML>
<html lang="en"><head>
</head>
<body>
<div id='gameArea'>
<canvas id='canvas0' width='480' height='320' style="position: absolute; "></canvas>
</div>
<script data-main="../../YepiMobileNew/UI/js/pageExternalGame" src="http://requirejs.org/docs/release/2.1.14/minified/require.js"></script>
<script src='js/gamemin.js'></script>
<script>yepiExternalPageGame.gameLoadingComplete()</script>
</body>
</html>

所以在他的页面中，他调用了我的对象 yepiExternalPageGame，它应该由 requirejs 加载。但是当他调用这个对象时，要求本身已经加载，但是类pageExternalGame仍然没有加载，所以调用时这个对象是不存在的。如何处理？（他的外部脚本也可以调用我的对象）。谢谢。

【问题讨论】：

标签： javascript html oop requirejs external-script

【解决方案1】：

首先，如果您与其他人共享您的 amd 应用程序，最好创建不使用 require.js 的构建，这样您就不会强迫其他开发人员添加另一个库并增加页面大小。你可以用 almond.js 做到这一点

但回到你的问题。

改变

<script>yepiExternalPageGame.gameLoadingComplete()</script>

到

<script>
    require(['../../YepiMobileNew/UI/js/pageExternalGame'], function() {
        yepiExternalPageGame.gameLoadingComplete();
    });
</script>

这会有所帮助。

【讨论】：