2015-08-11 2 views
4

Я использую плагин jquery.validationEngine.js. jqueryValidateEnglish не может работать, если jqueryValidateEngine загружен первым.Мне нужно убедиться, что плагин не будет загружаться до тех пор, пока его зависимость не будет загружена с использованием RequireJS

Мои jquery.wrapped.validationEnglish2.js кодируется как следующие:

 define(['jqueryValidateEngine'],function($){ 

     //Plugin Code here 

     }); 

Мой jquery.wrapped.validationEngine2.js кодируется так:

 define(['jquery'],function($){ 

     //Plugin Code here 

     }); 

Моя домашняя страница содержит:

<script src="/imagesrv/marketing/requireJS/assets/lib/require.js" data-main="/imagesrv/marketing/requireJS/assets/js/common2"> 

common2.js Содержит:

 //Configure RequireJS 

     require.config({ 
      baseUrl: "/imagesrv/marketing/requireJS/assets", 
      paths: { 
      // The libraries we use 
      jquery: [ 
       '/imagesrv/marketing/js/jquery.min' 
      ], 
      bootstrap: '/imagesrv/marketing/requireJS/assets/lib/bootstrap.wrapped.min', 
      smartdevice: '/imagesrv/marketing/requireJS/assets/page/smart-device', 
      eloquatag: '/imagesrv/marketing/requireJS/assets/page/eloqua-tag', 
      main: '/imagesrv/marketing/requireJS/assets/page/main', 
      startupkit: '/imagesrv/marketing/requireJS/assets/js/startup.wrapped.kit', 
      jqueryuicus: '/imagesrv/marketing/requireJS/assets/js/jquery-wrapped.ui-1.10.3.custom.min', 
      smoothscrl: '/imagesrv/marketing/requireJS/assets/js/jquery.smoothdivscroll.wrapped-1.3-min', 
      genscript: '/imagesrv/marketing/requireJS/assets/js/gen-wrapped.menu.script', 
      owlcarousel: '/imagesrv/marketing/requireJS/assets/js/owl.wrapped.carousel', 
      placeholder: '/imagesrv/marketing/requireJS/assets/js/jquery.wrapped.placeholder', 
      explorewhatshot: '/imagesrv/marketing/requireJS/assets/js/explorewhatshot.wrapped', 
      kiblog: '/imagesrv/marketing/requireJS/assets/js/ki.wrapped.blog.script', 
      jqueryValidateEnglish: '/imagesrv/marketing/requireJS/assets/js/jquery.wrapped.validationEnglish2', 
      jqueryValidateEngine: '/imagesrv/marketing/requireJS/assets/js/jquery.wrapped.validationEngine2' 

      } 

     }); 


require(['main', 'bootstrap', 'startupkit', 'eloquatag', 'owlcarousel', 'kiblog', 'jqueryuicus', 'jqueryValidateEnglish'], function($) {// Load up this pages script, once the 'common' script has loaded 
    console.log('jQuery and r.js have been loaded!'); 
}); 

Но я получаю следующее сообщение об ошибке в консоли, когда я запускаю мою страницу: «$ (...) validationEngine не является функцией

Console Screen Capture

Когда я смотрю в разделе Сеть. это показывает, что мои загруженные плагины загружаются, но по какой-то причине кажется, что они должны быть загружены не в порядок, что, вероятно, связано с тем, что я получаю консольную ошибку.

enter image description here

Я не уверен, что проблема есть.

+0

Я боюсь, что не знаю requirejs, но, глядя на код, может ли быть так же просто, как переключить порядок jqueryValidateEnglish и 'jqueryValidateEngine' в common2.js? –

+0

Это не будет работать, потому что jquery.wrapped.validationEnglish2.js зависит от jquery.wrapped.validationEngine2.js – Jimmy

+2

Правильно, но у вас есть 'jqueryValidateEnglish', который ссылается на jquery.wrapped.validationEnglish2.js, ** перед **' jqueryValidateEngine', который ссылается на jquery.wrapped.validationEngine2.js, в common2.js, поэтому вы сначала загружаете зависимый скрипт (по крайней мере, так выглядит на вкладке «Сеть»). –

ответ

1

Если загружено JQuery первого, может использовать $.holdReady(), $.when()

$.holdReady(true); 

    var scripts = { 
     bootstrap: '/imagesrv/marketing/requireJS/assets/lib/bootstrap.wrapped.min', 
     smartdevice: '/imagesrv/marketing/requireJS/assets/page/smart-device', 
     eloquatag: '/imagesrv/marketing/requireJS/assets/page/eloqua-tag', 
     main: '/imagesrv/marketing/requireJS/assets/page/main', 
     startupkit: '/imagesrv/marketing/requireJS/assets/js/startup.wrapped.kit', 
     jqueryuicus: '/imagesrv/marketing/requireJS/assets/js/jquery-wrapped.ui-1.10.3.custom.min', 
     smoothscrl: '/imagesrv/marketing/requireJS/assets/js/jquery.smoothdivscroll.wrapped-1.3-min', 
     genscript: '/imagesrv/marketing/requireJS/assets/js/gen-wrapped.menu.script', 
     owlcarousel: '/imagesrv/marketing/requireJS/assets/js/owl.wrapped.carousel', 
     placeholder: '/imagesrv/marketing/requireJS/assets/js/jquery.wrapped.placeholder', 
     explorewhatshot: '/imagesrv/marketing/requireJS/assets/js/explorewhatshot.wrapped', 
     kiblog: '/imagesrv/marketing/requireJS/assets/js/ki.wrapped.blog.script', 
     // load `jquery.wrapped.validationEngine2` before `jquery.wrapped.validationEnglish2` 
     jqueryValidateEngine: '/imagesrv/marketing/requireJS/assets/js/jquery.wrapped.validationEngine2', 
     jqueryValidateEnglish: '/imagesrv/marketing/requireJS/assets/js/jquery.wrapped.validationEnglish2' 
    }; 

    var requests = $.when.apply($, $.map(scripts, function(url, name) { 
     return $.getScript(url) 
    })); 

    requests.then(function() { 
     $.holdReady(false); 
    }, function(error) { 
     console.log(error) 
    }); 

    $(document).ready(function() { 
     // do stuff when `scripts` loaded 
    }); 
0

Я не уверен, если я правильно понял проблему, но от того, что я понял, что вам не хватает декларацию зависимости от ваших требуют. конфигурации, вы не говорите требуют, что это зависит от ничего, так, что вам нужно сделать изменения к чему-то вроде этого:

require.config({ 
    //alias 
    paths: { 
     jqueryValidateEnglish: '/imagesrv/marketing/requireJS/assets/js/jquery.wrapped.validationEnglish2', 
     jqueryValidateEngine: '/imagesrv/marketing/requireJS/assets/js/jquery.wrapped.validationEngine2' 
    }, 

    //dependencies 
    shim: { 
     'jqueryValidateEngine': ['jqueryValidateEnglish'] 
    } 
}); 

Я надеюсь, что это то, что вы ищете

+1

Да, я это понимаю, но я верю, что объявляю зависимость, потому что в файле jquery.wrapped.validationEnglish2 я говорю, что нужно, чтобы jquery.wrapped.validationEnglish2 зависел от jquery.wrapped.validationEngine2 с помощью: определяют ([ 'jqueryValidateEngine'], функция ($) { // Plugin код }); – Jimmy

+1

О, это распространенное заблуждение, это две разные вещи, вы должны объявить их в обоих местах, один для включения файлов (порядок файлов) и один для инъекции зависимостей (порядок переменных и функций), я надеюсь, что это имеет смысл к вам –

+0

Хорошо, я посмотрю – Jimmy

Смежные вопросы