是require.js“正常”网站的正确工具(用于工作)“

时间:2012-08-01 03:38:59

标签: requirejs

我已经开始构建一个网站,并使用Require.js有选择地加载我需要实现功能的脚本。我所经历的是:

  • 在我的某些代码使用“require”加载依赖项之前,“main”脚本尚未完成执行(甚至下载)。这意味着require.js配置没有运行,也不知道我的脚本的位置。
  • 因为在我的代码需要使用它时,require.js配置尚未运行,所以“shim”机制尚未初始化且无法使用。

Common Errors页面以及我在尝试解决自己的问题时似乎正在阅读的许多问题似乎表明这不适合这项工作。

这似乎对单页面应用程序或node.js应用程序很有用,但对于在初始化require.js之前其他脚本可以运行的传统站点不是很有用。

如果require.js不适合这份工作,那么这项工作是否有合适的工具?如果是,那么是什么?

1 个答案:

答案 0 :(得分:1)

您是否异步加载require.js脚本(使用async='async')?您希望requirejs同步加载。一旦加载,它将异步加载进一步的脚本,如main.js文件。它们可能全部加载乱序,但代码实际上会以正确的顺序执行(尊重声明的依赖项)。

因此,在您的网页模板中,您将拥有以下内容:

<script src="/Scripts/require.js" type="text/javascript" data-main="main.js"></script>

这将加载RequireJS,一旦加载它就开始异步加载main.js。通常main.js不定义任何模块,它只使用其他文件中定义的模块。这些依赖项列在require()调用中:

require(["moduleA", "moduleB"], function(A, B){
  // Do something with A and B
  A.someFunction();
  B.someOtherFunction();
});

文件moduleA.jsmoduleB.js必须将其内容包装在define()内。在moduleA.js(取决于模块C):

define(["moduleC"], function () {
  // Build up an A
  var A = ....;

  return A;
});

我现在想知道你是否在define电话中包装你的模块。不这样做可以解释您正在经历的无序执行。

RequireJS是传统网站上非常有效的工具,而不仅仅是在单页网站上。