如何要求一个文件,但加载一个或多个文件

时间:2014-02-03 20:56:04

标签: knockout.js requirejs knockout-validation

我刚开始使用Require.js。我有基本的工作。

这是我要解决的问题:我正在使用KnockoutJs和Knockout.validation。我总是一起使用这些文件。所以我想做一些我只需要引用淘汰赛的内容,它将包括knockout.validation。

这:(加载淘汰赛和淘汰赛。验证)

define(["knockout"],
    function (ko) {     
        return {
            name: ko.observable();
        };
    }
);

而不是:

define(["knockout", "kovalidation"],
    function (ko) {     
        return {
            name: ko.observable();
        };
    }
);

我需要对ko的引用,我只需要加载其他的。

更新

基于下面的答案我正在尝试捆绑配置选项。不幸的是我无法让它发挥作用。

我的理解是配置应该如下:

<script>
    var require = {
        baseUrl: "/Scripts",
        bundles: {
            'knockout-3.0.0': ['knockout.validation']
        }
    };
</script>
<script src="~/Scripts/require.js" data-main="views/home"></script>

然后在我的家里.js:

require(["knockout-3.0.0"], function (ko) {
   ...
});

在home.js中,我希望看到knockout和knockout.validation都被加载,但只加载了knockout。

更新:

配置中的捆绑选项似乎应该做我需要的,但至少在这一点上,根据我的信息,这不是正确的解决方案。 @ daedalus28提供了一些很好的信息和一个很好的例子,帮助我提出了一个可以接受的解决方案。我接受了这个答案,如果一个更好的答案很长,请投票给我们,所以我们都知道它更好。

3 个答案:

答案 0 :(得分:1)

我经常有一个LibraryPlugins模块,我在最初的require电话中加载。在那个模块中,我加载了我想要的所有插件 - 比如敲除绑定,下划线mixins,jquery插件等等。因为这是我第一次需要调用,我知道它添加的扩展通常在我的应用程序中可用< / p>

有时我会采用更模块化的方法,并为每个库提供一个额外的模块,返回它正在运行的库(即一个用于返回ko的自定义绑定和一个用于返回修改后的下划线的自定义mixins的下划线) 。这种方法最终看起来很像路易斯的答案,但没有额外的map:*配置。有些模块将自己暴露为一个命名模块,这使得它更难以使用 - 当你使用map:*别名时,就像路易斯的解决方案一样。对于我没有使用大量不同库的项目,我倾向于只有一个LibraryPlugins模块,因为当存在少量依赖项时,它更容易管理。

这是一个jsfiddle,我展示了两种方法。

为方便起见,我还会将代码粘贴到此处:

require.config({
    paths: {
        'knockout':'//cdnjs.cloudflare.com/ajax/libs/knockout/3.0.0/knockout-min',
        'knockout.validation': '//cdnjs.cloudflare.com/ajax/libs/knockout-validation/1.0.2/knockout.validation.min',
        'underscore.core': 'http://underscorejs.org/underscore-min',
        'underscore.string': 'http://epeli.github.com/underscore.string/lib/underscore.string'
    },
    shim: {
        'underscore.core': {exports:'_'}
    }
});

// Approach 1: One module to load everything in advance
define('LibraryPlugins', ['knockout', 'knockout.validation'], function(ko){ });

// Approach 2: One module for each library
define('underscore', ['underscore.core', 'underscore.string'], function (_, _string) {
    _.mixin(_string.exports());
    return _;
});

require(['knockout', 'underscore', 'LibraryPlugins'], function(ko, _) {
    console.log(ko.validation);
    console.log(_.humanize);
});

答案 1 :(得分:0)

您是否已查看bundle property of require.config

  

在RequireJS 2.1.10中引入:允许指向多个模块ID   包含一组模块的模块ID。

答案 2 :(得分:0)

您可以使用noConflict调整用于加载jQuery的方法。我正在调整that method上的文档中的以下内容:

require.config({
    // Add this map config in addition to any baseUrl or
    // paths config you may already have in the project.
   map: {
      // '*' means all modules will get 'knockout-private'
      // for their 'knockout' dependency.
      '*': { 'knockout': 'knockout-private' },

      // 'knockout-private' wants the real knockout module
      // though. If this line was not here, there would
      // be an unresolvable cyclic dependency.
     'knockout-private': { 'knockout': 'knockout' }
   }
});

knockout-private模块将是这样的:

define(['knockout', 'kovalidation'], function (ko) {
    return ko;
});

您可以将任意数量的其他模块添加到knockout-private