4

我是第一次使用 require.js,目前一切正常。但是,我开始想做一个构建。这个想法是用我所有的 js 和模板创建一个文件。但是,每次我使用 r.js 时,它只包含我的主模块的依赖项。

这是我的 app.build.js:

({
appDir: "public/javascripts",
baseUrl: ".",
dir: "build",
paths: {
    "hbs": "lib/hbs",
    "jquery": "lib/jquery",
    "Handlebars": "lib/Handlebars",
    "Backbone": "lib/backbone",
    "underscore": "lib/underscore",
    "bootstrap": "lib/bootstrap.min.js"
},
modules: [{name: "main"}],
shim: {
    "bootstrap": {
      deps: ["jquery"],
      exports: "$.fn.popover"
    },
    underscore: {
      exports: '_'
    },
    'Handlebars': {
      exports: 'Handlebars'
    },
    Backbone: {
      deps: ["underscore", "jquery"],
      exports: "Backbone"
    }
}}) 

main.js 的开头:

require.config({
 paths: {
    "hbs": "lib/hbs",
    "Handlebars": "lib/Handlebars",
    "Backbone": "lib/backbone",
    "underscore": "lib/underscore",
    "jquery": "lib/jquery",
    "bootstrap": "lib/bootstrap.min.js"
  },
  hbs: {
    disableI18n: true
  },
  shim: {
    "bootstrap": {
      deps: ["jquery"],
      exports: "$.fn.popover"
    },
    underscore: {
      exports: '_'
    },
    'Handlebars': {
      exports: 'Handlebars'
    },
    Backbone: {
      deps: ["underscore", "jquery"],
      exports: "Backbone"
    }
  }
});

require(['jquery', 'Backbone', 'videos'], function($, Backbone, Videos) { // Whatever });

在这种情况下,在我的构建“main.js”中创建的最终文件仅包含:jquery、下划线、主干和视频。我如何确保它还包含模块的依赖项,videos即:模板'hbs!template/videos/show'。即使在任何地方都不需要它,我也如何确保也添加了 bootstrap.min.js?最后我应该删除require.config,因为它将定义不再应该存在的路径,因为所有模块都在最终文件中?

4

2 回答 2

8

要让优化器包含所有嵌套依赖项,请在构建文件或命令行中包含此选项:

{
     findNestedDependencies: true
}

这使它像您期望的那样工作,并且您不必在主文件中包含所有依赖项。这是一个秘密......我从未在文档中看到过这个,但我在某个地方的随机博客上读到了它。

于 2014-07-25T21:01:05.737 回答
3

在你的 app.build.js 中包含指向你的主配置文件的链接,你可以删除指定的模块,这应该包括主模块使用的所有依赖项。

({
  ...
  mainConfigFile: 'main.js',
  ...
})

您也可以跳过路径和垫片,因为这已经在 main.xml 中指定了。Bellow 是我在我的一个项目中使用的示例配置,它的作用就像一个魅力:

({
    name: 'main',
    baseUrl: '../',
    // optimize: 'none',
    optimize: 'uglify2',
    exclude: ['jquery'],
    paths: {
        requireLib: 'require'
    },
    mainConfigFile: '../main.js',
    out: '../main.min.js',
    // A function that if defined will be called for every file read in the
    // build that is done to trace JS dependencies.
    // Remove references to console.log(...)
    onBuildRead: function (moduleName, path, contents) {
        return contents;
        // return contents.replace(/console.log(.*);/g, '');
    }
})
于 2013-05-04T04:19:50.450 回答