与yepnope多个条件(Multiple conditions with yepnope)

2019-09-22 05:52发布

我用yepnope.js作为加载的资源。 我想,只有当所有该模块的依赖性已经被加载在我的JS模块来执行代码。 我不想加载已经加载JS的依赖。

假设,我有依赖D1.js和D2.js. 我试过了

yepnope({
    load: ['D1.js', 'D2.js],
    complete: function() {
        //execute my code here
    }
});

这样的作品,但是,资源被加载每次,即使他们已经之前加载。

如果我做多次测试这样的:

yepnope([{
    test: $().d1,
    nope: 'D1.js'
},
{
    test: $().d2,
    nope: 'D2.js'
}]);

目前还不清楚在哪里把整体完成功能- 所有的资源都被加载后运行一个。

是否有可能与yepnope要做到这一点,或者我需要使用不同的组件?

谢谢。

Answer 1:

相应的脚本执行后的回调运行(不只是加载)。 所有的脚本,以便运行,所以如果你把一个callback或一个complete的最后一个对象的属性,它会最后运行。



Answer 2:

比方说,你需要有条件加载的jquery.js,jquery.jgrowl.js和jquery.powertip.js。 你所期望的下面的代码工作:

yepnope([{
  test: typeof(window.jQuery) === 'undefined' || 
        jQuery.fn.jquery.match(/^1\.[0-9]+/) < 1.7,
  yep: '//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js'
},
{
  test: typeof(window.jQuery) === 'undefined' 
        || typeof(window.jQuery.fn.jGrowl) === 'undefined',
  yep: ['//cdnjs.cloudflare.com/ajax/libs/jquery-jgrowl/1.2.12/jquery.jgrowl.min.js',
        '//cdnjs.cloudflare.com/ajax/libs/jquery-jgrowl/1.2.12/jquery.jgrowl.css'],
  complete: function() {
    console.log('completed loading jGrowl (should fire first, or not at all)');
  }
},
{
  test: typeof(window.jQuery) === 'undefined' 
        || typeof(window.jQuery.fn.powerTip) === 'undefined',
  yep: ['//cdnjs.cloudflare.com/ajax/libs/jquery-powertip/1.1.0/jquery.powertip.js', 
        '//cdnjs.cloudflare.com/ajax/libs/jquery-powertip/1.1.0/jquery.powertip.min.css'],
  complete: function() {
    console.log('completed loading powertip'); 
    jQuery.jGrowl("Growling!");
  }
}
]);

但是,如果此在的运行环境jquery.powertip.js已经加载的页面上,但jquery.jgrow.js不是,这将抛出一个错误,由于“完整的”回调被马上解雇,而不是当所有的文件加载完成。

下面拨弄演示与yepnope 1.5.4这个错误: http://jsfiddle.net/dergachev/HHxK2/

还要注意的是,在目前的主干(主分支)yepnope的,这个错误就会消失。 它可能涉及到以下门票(这是从来没有回迁到1.5.4):

  • https://github.com/SlexAxton/yepnope.js/pull/140
  • https://github.com/SlexAxton/yepnope.js/issues/132
  • https://github.com/SlexAxton/yepnope.js/issues/100
  • https://github.com/SlexAxton/yepnope.js/issues/96
  • https://github.com/SlexAxton/yepnope.js/issues/29


文章来源: Multiple conditions with yepnope