好吧,这就像我在两天内关于require.js的第三个问题,问题是我有一个包含以下模块的项目:
main.js
res.js
juego.js
并且在主文件中,一旦加载了所有模块,必须调用的回调有时会被触发,有时则不会.
我不会发布任何代码,因为我不相信它有什么问题,但我必须提到它不能是加载顺序的问题因为我的文件没有任何依赖其他.这真的很奇怪,我的文件不是太大(首先有73行,第二行有18行)
所以问题是,可能出现什么问题?一个require.js错误或其他什么?
编辑:这是我的模块的代码:
main.js:
require ( ['cliente/juego', 'cliente/res'], function (juego, res) { function main () { alert('ok'); } window.addEventListener('load', main, false); } );
res.js:
define ( function () { return (function () { var recursos = { soldado : { ruta : 'res/imagenes/soldados/1.png', tipo : 'Image', fuente : null } }; var metodos = {}; var cargados = 0; var totales = 0; var listos = false; // Todavía no se han cargado los recursos function terminarCarga (evento) { // Cada vez que se cargue un recurso se incrementará el progreso cargados++; if (cargados == totales) { listos = true; // Recursos cargados y listos para usarse // Acción a seguir una vez cargados todos los recursos } } metodos.getTotales = function () { return totales; } metodos.getListos = function () { return listos; } metodos.cargar = function () { // Carga todos los recursos var recurso; for (var i in recursos) { totales++; recurso = recursos[ i ]; if (recurso.tipo == 'Image') { recurso.fuente = new Image; recurso.fuente.onload = terminarCarga; recurso.fuente.src = recurso.ruta; } else { recurso.fuente = new Audio; recurso.fuente.addEventListener('loadeddata', terminarCarga, false); recurso.fuente.src = recurso.ruta; } } } metodos.get = function (nombre) { return recursos[ nombre ].fuente; } return metodos; })(); } );
juego.js:
define ( function () { return (function () { var metodos = {}; metodos.getContexto = function () { // Recordar llamar ésta función una vez cargada la página this.canvas = document.querySelector('canvas'); this.contexto = this.canvas.getContext('2d'); } return metodos; })(); } );
主函数中的警报仅在所有情况的10%中弹出.
问题不在于RequireJS或您如何使用RequireJS.问题是有时load
事件发生在 window.addEventListener('load', main, false);
执行之前.我敢打赌,如果你将你的身体main.js
改为以下,它将永远有效:
require(['cliente/juego', 'cliente/res'], function (juego, res) { console.log('ok'); });
你可能想要使用domReady
插件,它会处理这样的问题.就像是:
require(['domReady', 'cliente/juego', 'cliente/res'], function (domReady, juego, res) { domReady(function () { alert('ok'); }); });