आवश्यकता के साथ एक jQuery प्लगइन को कैसे लोड किया जा सकता है

Question 1

मैं आवश्यकता के साथ काम कर रहा हूँ jquery + और मैं सोच रहा था कि वहाँ एक jQuery प्लगइन बनाने के लिए एक स्मार्ट तरीका था आवश्यकता के साथ अच्छी तरह से काम करते हैं।

उदाहरण के लिए, मैं jQuery-कुकी का उपयोग कर रहा हूं। अगर मुझे सही तरह से समझ में आया तो मैं jquery-cookie.js नामक एक फाइल बना सकता हूँ और अंदर करूँगा

define(["jquery"], // Require jquery
       function($){
// Put here the plugin code. 
// No need to return anything as we are augmenting the jQuery object
});
requirejs.config( {
    "shim": {
        "jquery-cookie"  : ["jquery"]
    }
} );

मैंने सोचा कि अगर मैं jQuery की तरह काम कर सकता है, जो इस तरह है:

if ( typeof define === "function" && define.amd && define.amd.jQuery ) {
    define( "jquery", [], function () { return jQuery; } );
}

या अगर यह जरिया या किसी भी amd के साथ संगत jQuery प्लगइन्स बनाने का एकमात्र तरीका है

Question 2

आपको केवल EITHER करने की आवश्यकता है

define(["jquery"], // Require jquery
       function($){
// Put here the plugin code. 
// No need to return anything as we are augmenting the jQuery object
});

jquery-cookie.js के अंत में, या

requirejs.config( {
    "shim": {
        "jquery-cookie"  : ["jquery"]
    }
} );

इससे पहले कि आप jquery-cookie को शामिल करें (उदाहरण के लिए, जहाँ भी डेटा-मुख्य बिंदु हों)।

आपके द्वारा पोस्ट किया गया अंतिम कोड ब्लॉक jQuery जैसी चीजों के लिए अच्छा है जो पुनर्वितरित हो जाते हैं और एक AMD वातावरण में हो सकते हैं या नहीं भी हो सकते हैं। आदर्श रूप से हर jQuery प्लगइन पहले से ही सेट है।

मैं शामिल पुस्तकालयों को यथासंभव अनधिकृत रखना पसंद करता हूं, इसलिए प्रति पृष्ठ एक बार वैश्विक शिम कॉन्फिग मुझे सबसे स्वच्छ समाधान की तरह लगता है । इस तरह से अपग्रेड सुरक्षित हैं और CDN एक संभावना बन जाते हैं।

Question 3

Http://jquirejs.org/docs/api.html#config-shim पर बताए गए आवश्यकताएँ में शिम विन्यास का उपयोग करने के साथ कुछ चेतावनी हैं । । जब आप ऑप्टिमाइज़र का उपयोग कर रहे हों, तब "बिल्ड में शिम कॉन्फिग के साथ सीडीएन लोडिंग को न मिलाएं।"

मैं बिना आवश्यकता के साथ और बिना दोनों साइटों पर समान jQuery प्लगइन कोड का उपयोग करने के लिए एक रास्ता तलाश रहा था। मुझे यह स्निपेट jgg plugins के लिए https://github.com/umdjs/umd/blob/master/jqueryPlugin.js पर मिला । आप इस कोड में अपने प्लगइन को लपेटते हैं, और यह किसी भी तरह से ठीक से काम करेगा।

(function (factory) {
if (typeof define === 'function' && define.amd) {
    // AMD. Register as an anonymous module depending on jQuery.
    define(['jquery'], factory);
} else {
    // No AMD. Register plugin with global jQuery object.
    factory(jQuery);
}
}(function ($) {

    $.fn.yourjQueryPlugin = function () {
        // Put your plugin code here
    };  

}));

क्रेडिट जर्कबरी को जाता है; इतनी जावास्क्रिप्ट की तरह, यह अन्य कार्यों पर कार्य करने वाले कार्यों के अंदर कार्य करता है। लेकिन मुझे लगता है कि मैंने जो किया है, उसे अनपैक किया है।

factoryपहली पंक्ति में फ़ंक्शन तर्क अपने आप में एक फ़ंक्शन है जो लॉजिक को प्लगइन को परिभाषित करने के लिए लगाया जाता है $। जब कोई एएमडी-संगत लोडर मौजूद नहीं होता है, तो इसे सीधे वैश्विक jQueryऑब्जेक्ट पर प्लगइन को परिभाषित करने के लिए आमंत्रित किया जाता है । यह आम प्लगइन परिभाषा मुहावरे की तरह है:

function($)
{
  $.fn.yourjQueryPlugin = function() {
    // Plugin code here
  };
}(jQuery);

यदि कोई मॉड्यूल लोडर है, तो factoryलोड करने वाले के लिए कॉलबैक के रूप में पंजीकृत किया जाता है लोड करने के बाद jQuery लोड करने के लिए। JQuery की भरी हुई प्रति तर्क है। इसके बराबर है

define(['jquery'], function($) {
  $.fn.yourjQueryPlugin = function() {
     // Plugin code here
  };
})

Question 4

बस के रूप में jquery प्लगइन्स में से कुछ के लिए एक FYI करें पहले से ही amd / की आवश्यकता होती है ताकि आपको शिम में कुछ भी घोषित करने की आवश्यकता न हो। वास्तव में ऐसा करने से कुछ मामलों में आपके लिए समस्या हो सकती है।

यदि आप jquery कुकी JS में देखते हैं, तो आप परिभाषित कॉल और आवश्यकता (["jquery"]) देखेंगे।

और jquery.js में आपको परिभाषित करने के लिए एक कॉल दिखाई देगी ("jquery", [], फ़ंक्शन () ...