RequireJS结构 - 构建,包括一般问题

时间:2015-01-25 10:01:56

标签: javascript requirejs

我不明白如何在小型主页项目中正确使用RequireJS。使用优化器会让我更加困惑。

我缺少的是一些一般结构

  • 是否明智地拥有始终加载的文件,即common.js?如果是,是否应使用data-main加载,还是更好地关注this simple template

这里,使用data-main加载的文件仅包含配置,并且需要主应用程序代码作为依赖项(这意味着已经有两个http请求,我猜想可以由优化器修复):

// For any third party dependencies, like jQuery, place them in the lib folder.

// Configure loading modules from the lib directory,
// except for 'app' ones, which are in a sibling
// directory.
requirejs.config({
    baseUrl: 'lib',
    paths: {
        app: '../app'
    }
});

// Start loading the main app file. Put all of
// your application logic in there.
requirejs(['app/main']);
  • 使用优化器时,我注意到默认情况下findNestedDependencies设置为false,这意味着在require()调用中使用require()调用声明的依赖关系获胜不予考虑。这是否意味着优化代码实际上应该只包含主代码 - 应用程序的核心,无处不在,或多或少地使用 - 并且异步加载某些依赖项仍然可以吗?

  • 我应该如何在我的构建中包含require.js?我尝试将其列为核心的依赖项,但这意味着我必须停止使用

<script data-main="assets/js/common" src="assets/js/vendor/require.js"></script>

因为否则,它将被加载两次(一次作为common.js的依赖,一次因为它在src属性中)。

要仅加载一次,我会直接包含common.js,然后加载require.js作为依赖 - 对我来说似乎有点奇怪。

1 个答案:

答案 0 :(得分:1)

  

有一个总是加载的文件,即common.js,这是明智的吗?如果是这样,是否应该使用data-main加载,还是更好地遵循这个简单的模板?

完全取决于项目的详细信息。一个需要时间可用性很重要的大型项目必须采用与小型项目不同的方式。这里没有任何一个尺寸适合所有人。

  

使用优化器时,我注意到默认情况下findNestedDependencies设置为false,这意味着在require()调用中使用require()调用声明的依赖关系将不会考虑到了。

这意味着require()调用 require()调用内的define()次调用将不会用于确定整个依赖项列表。

  

这是否意味着优化的代码应该只包含主代码 - 应用程序的核心,无处不在,或多或少地使用 - 并且异步加载某些依赖项仍然可以吗?

RequireJS始终异步加载依赖项。 findNestedDependencies没有任何改变。可能你的意思是“仍然可以选择加载某些依赖项”。是的,没关系。我在我的一个项目中做到了。

请注意,findNestedDependenciesr.js跟踪可选依赖项的能力无关。如果findNestedDependenciestrue且您执行此操作:

define(function () {
    if (some_condition) {
        require(["blah"]);
    }
});

并且此模块包含在构建中,然后还将包含blah。 RequireJS无法确定some_condition是否会一直false。相反,如果你这样做:

define(function () {
    var deps = [];
    if (some_condition) {
        deps.push("blah");
    }
    require(deps);
});

然后r.js永远不会在构建中包含blah,因为它没有对实现这一点所需的级别进行源解释,就像第一种情况一样,blah 可能需要。所以在后一种情况下必须确保应用程序的核心能够在运行时找到blah。通常,这意味着具有r.js的构建配置,该构建配置将使用modules数组来定义核心的捆绑,并且可以选择加载每个模块的捆绑。

  

我应该如何在我的构建中包含require.js

可以在其中创建包含RequireJS的捆绑包,这样您就不必单独列出RequireJS。记录在案here

  

如果要将require.js包含在main.js源中,可以使用以下命令:

node ../../r.js -o baseUrl=. paths.requireLib=../../require name=main include=requireLib out=main-built.js
     

由于“require”是保留的依赖项名称,因此您需要创建“requireLib”依赖项并将其映射到require.js文件。

     

完成优化后,您可以将脚本标记更改为引用“main-built.js”而不是“require.js”,并且您的优化项目只需要发出一个脚本请求。