올바른 방법으로 RequireJS와 함께 jQuery 플러그인을 추가하십시오.

Question

상위 요소 내의 요소를 세로로 정렬하는 jQuery 플러그인을 추가하고 싶습니다. 내가 RequireJS를 사용하지 않는 다른 경우에, 난 그냥과 같이, 전역 함수를 작성합니다

(function ($) { 
    $.fn.vAlign = function() { 
     return this.each(function() { 
     var ah = $(this).height(); 
     var ph = $(this).parent().height(); 
     var mh = (ph - ah)/2; 
     $(this).css('margin-top', mh); 
     }); 
    }; 
})(jQuery); 

나는 다음과 같이 그를 호출 할 수 있습니다 : $('.someclass').vAlign()를. 내가 이해하려고하는 것은 이것이 RequireJS를 사용하고있는 지금 어떻게해야하는지입니다. 모듈을 작성합니까?

RequireJS here을 사용하여 모듈을 작성하는 방법에 대한 설명을 찾았지만 jQuery에서와 같이 DOM의 요소가 아닌 함수를 호출하는 시나리오를 설명합니다. 모듈을 정의했습니다.

jQuery에서와 같이 DOM의 요소에서 함수를 호출 할 수 있도록 RequireJS에 모듈을 작성하는 방법이 있습니까?

Answer 1

확실히 별도의 모듈을 작성하고 필요할 때로드 할 수 있습니다.

valign.js은 요소를 수직으로 정렬하는 논리를 포함하는 모듈입니다.

//valign.js 
define(['jquery'], function($) { 
    $.fn.vAlign = function() { 
     return this.each(function() { 
      var ah = $(this).height(); 
      var ph = $(this).parent().height(); 
      var mh = (ph - ah)/2; 
      $(this).css('margin-top', mh); 
     }); 
    }; 
}); 

수직 정렬 코드 내가 선택적으로 사용할 수있을 때 종속성을 지정하는 require.js를 사용하는 자바 스크립트 파일을 쓸 수 [의

//main.js 
define(['jquery','valign'], function($, v) { 
    $('.someclass').vAlign(); 
});