Написание плагина jquery в coffeescript - как получить "(function ($)" и "(jQuery)"?

Question

Я пишу плагин jquery в coffeescript, но не уверен, как правильно получить часть оболочки функции.

Мой кофейный код начинается с этого:

$.fn.extend({
    myplugin: ->
        @each ->

, который создает javascript с помощью функции-оболочки:

(function() {
  $.fn.extend({
      myplugin: function() {
          return this.each(function() {

но я хочу, чтобы '$' передавалось так:

(function($) {
  $.fn.extend({

Похоже на концовку, которую я имею ... ничего особенного в coffeescript.
Я получаю это в JavaScript:

})();

Но хотелось бы вот что:

})(jQuery);

Кто-нибудь знает, как этого добиться с помощью компилятора coffeescript? Или как лучше всего это сделать в coffeescript?

Answer 1

Ответ заключается в том, что вам не нужно так называть его в CoffeeScript - ваш сценарий уже надежно завернут в замыкание, поэтому нет необходимости в jQuery-pass-in-a-parameter-tricks. Просто напишите:

$ = jQuery

... в верхней части вашего сценария, и вы готовы.

Answer 2

Если вы не используете флаг --bare в компиляторе,

$ = jQuery

решение лучше. Если вы , то с новым ключевым словом do вы можете написать

do ($ = jQuery) ->
   # plugin code...

, тем самым создавая желаемую область видимости, избегая путаницы в скобках.

Answer 3

ОБНОВЛЕНИЕ / РЕДАКТИРОВАНИЕ: Да, согласно объяснению Джереми:

$ = jQuery

$.fn.myPlugin = () ->
  console.log('test fired')

компилируется в:

(function() {
  var $;
  $ = jQuery;
  $.fn.myPlugin = function() {
    return console.log('test fired');
  };
}).call(this);

, который работает простохорошо как плагин jQuery: $('body').myPlugin();

Оригинал:

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

(($) ->
  $.fn.extend =
    myplugin: ->
    @each: ->
)(jQuery)

рендерит в:

(function() {
  (function($) {
    return $.fn.extend = {
      myplugin: function() {},
      this.each: function() {}
    };
  })(jQuery);
}).call(this);

Answer 4

Самый простой способ - продлить $. Fn object

Простой плагин jQuery может быть написан на CoffeeScript следующим образом:

$.extend $.fn,

  disable: ->
    @each ->
      e = $(this)
      e.attr("disabled", "disabled") if e.is("button") or e.is("input")

будет компилироваться в

(function() {
  $.extend($.fn, {
    disable: function() {
      return this.each(function() {
        var e;
        e = $(this);
        if (e.is("button") || e.is("input")) {
          return e.attr("disabled", "disabled");
        }
      });
    }
  });
}).call(this);

Answer 5

Хотя этот пост старый, я нашел его полезным. Вот код сценария кофе, который работает для меня.

$ -> 
    $('.my-class').hello()

$.fn.hello=-> 
    @each -> 
        $(@).append $ '<div>Hello</div>'

Примечание : вам не нужно объявлять переменную $, вы можете просто использовать ее прямо из коробки.

Answer 6

Вы должны взглянуть на версию jQuery Boilerplate для CoffeeScript ~ https://github.com/zenorocha/jquery-boilerplate/blob/master/jquery.boilerplate.coffee

Answer 7

Вы можете просто добавить закрытие самостоятельно и скомпилировать его с флагом --bare.

coffee -w -c --bare jquery.plugin.coffee

(($) ->
  # some code here
)(jQuery)

Answer 8

просто и понятно

Это все, что мне нужно было сделать, чтобы добавить свой собственный метод cleanFadeIn к объектам jQuery. Возвращает также объекты для цепочки:

$.fn.extend
  cleanFadeIn: ->                     # $('.notice').cleanFadeIn
    return $(@).each ->               # returns the objects for easy chaining.
      $(@).slideDown 'slow', ->
        $(@).fadeTo 'slow', 1