页面中有多个js文件,每个文件都以require()开头:不好的做法还是OK?

时间:2012-11-13 11:45:34

标签: javascript module dojo

我正在编写一个框架,允许您的模块定义在提供之前将哪些JS文件添加到页面中。我们的想法是模块可能会添加如下内容:

require([ 'dojo/topic', 'dojo/_base/window', 'hotplate/hotDojoWidgets/AlertBar' ], function( topic, win, AlertBar
){
  globalAlertBar = new AlertBar( { background: '#FF4444' } );
  globalAlertBar.placeAt( document.body, 'first' );
  globalAlertBar.startup();

  topic.subscribe('globalAlert', function( message, displayFor ){
    displayFor = displayFor || 2500;
    globalAlertBar.set( 'message', message );
    globalAlertBar.show( displayFor );
  });
});

这允许我举例来允许应用程序周围的其他小部件发布globalAlert以显示alertBar。 现在:

  • 添加到要加载的JS列表中的任何JS / Dojo文件都以" require"开头。对我来说,这只是在加载后的某个时刻运行的异步代码。在框架中以这种方式加载的大多数代码将等待发布主题,并将采取相应的行动
  • "应用程序"将只是其中一个模块,它将订阅发布容器对象的主题
  • "适当"由require()加载的Dojo小部件显然会使用" define" - 照常营业,不用担心

问题:

1)如果我在页面中引用的一个JS / Dojo文件中运行ready(),那么它是一个页面级ready(),包括文档中加载的所有.js文件吗?或者只针对当前文件加载的文件?

2)我意识到"对"做事方式是只有一个运行require()的JS文件,并从那个文件加载其他所有内容(甚至更好地使用data-dojo-main)。但是,我正在尝试定义独立工作的模块(带有服务器和客户端代码)并将自己添加到页面中...所以,实际上是不好的做法,在应用程序页面中有一堆文件,然后拥有它们require()运行和运行Dojo代码?

谢谢!

Merc的。

P.S。 如果你很好奇,https://github.com/mercmobily/hotplate ......项目在这里发布后开始了!

1 个答案:

答案 0 :(得分:1)

您可以根据需要为每个页面/文件/脚本提供尽可能多的需要。它的 define 只能在每个页面使用一次,因为它是页面/脚本位置和模块ID之间的关联。 define 并不严格用于小部件 - 它定义了一个模块,它可以是一个函数,构造函数(类),一个单例对象,或者只是做一些工作而不返回任何东西。

require 是异步的;因此,当所有依赖关系完成加载时会触发的回调方法:

require(modules, callback);

dojo / ready 基本上是“基于块”的。在所有依赖项已加载 DOM准备好之前,回调将不会触发。它不是基于页面的,也不是全局的 - 如果第一个被阻止等待DOM,那么在第一个要求之前触发的第二个要求很可能会在第一个要求之前触发。