寫，沒有requirejs

Question

我想一個方法來創建我的模塊工作Requirejs模塊，它們可以使用和不requirejs使用（沒有要求他們應該只是正常工作的js，所以我必須要確保他們正確加載，比如按照正確的順序放置腳本標籤）。

所以jQuery不會是kindof這樣的：

// export module 
if (typeof define === "function" && define.amd) {  
    define(["dep"], function(dep){ 
     dep.fn.test = test; 
     return dep; 
    }); 
} 
else{ 
    dep.fn.test = test; 
} 

實際的模塊定義爲像這樣

var dep = function(...){...} 

這個定義，出口部分是IIFE內把一切都在出全球範圍。

一般來說，它有效，但有一個例外，依賴項不可用。 這個問題可以通過在定義部分中定義函數來解決，但是這意味着定義它兩次，在定義部分和在其他部分中定義它。

我怎樣才能使這個工作，但只定義模塊一次？

我有「插件式」擴展到核心DEP它都應該在單獨的文件，因此主要DEP必須作爲一個depenency

這工作得很好BTW傳遞。但這意味着我編寫了兩次測試代碼。

(function(){ 
    // export module 
    if (typeof define === "function" && define.amd) {  
     define(["dep"], function(dep){ 
      dep.fn.test = function(){...ssomething using dep...}; 
      return dep; 
     }); 
    } 
    else{ 
     dep.fn.test = unction(){...ssomething using dep...}; 
    } 

}) 

好吧，我試試另一個例子

動畫/ animate.js（這是我的主文件）

define(function(){ 
    ... 
    return animate; 
}); 

動畫/模塊/ easing.js（這是一個模塊文件） （function（）{ var ease = function（）{ //使用animate.js的主動函數動畫 // animate在這裏不可用 ... };

if (typeof define === "function" && define.amd) { 
    define(["animate/animate"], function(animate){ 
     // animate is available here 
     ... 
    animate.fn.ease = ease; 
    return animate; 
    }); 
} 
else 
{ 
    // if no requirejs, animate is global 
    animate.fn.ease = ease; 
} 
}); 

Answer 1

的實際問題似乎是define不可用IIFE內，但window.define是。所以將定義作爲參數傳遞給IIFE解決了這個問題。

(function(define){ 
    // export module 
    if (typeof define === "function" && define.amd) {  
     define(["dep"], function(dep){ 
      dep.fn.test = function(){...ssomething using dep...}; 
      return dep; 
     }); 
    } 
    else{ 
     dep.fn.test = unction(){...ssomething using dep...}; 
    } 

}(window.define)) 

之前，它會檢查define，沒有找到它，並立即嘗試武官它dep.fn.test沒有requirejs定義的一部分。

Answer 2

我覺得你只是寫define錯誤，因此它沒有得到註冊。這是我使用的。

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

投入方面

(function(window) { 
    var telegraph = function() { }; 

    telegraph.prototype.test = function() { 
     // do something 
    }; 

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

    window.telegraph = telegraph; 

})(window); 

編輯

做真正的問題是你如何定義test和利用dep內部，這樣你就不必爲它供給作爲依賴關係，並且可以定義一個名爲dep的模塊。一種解決方案是在構造函數中註冊所述第二級別的功能和捕捉this作爲self（或另一變量）該函數內使用。這裏的關鍵是你使用define來定義命名模塊，並且通過在構造函數中使用捕獲的上下文，你不需要提供父對象作爲依賴。示例（與http://jsfiddle.net/YS8v6/工作小提琴）：

(function(){ 
    var dep = function() { 
     var self = this; 
     self.fn.test = function() { 
      self.foo(); 
     }; 
    }; 

    dep.prototype.foo = function() { 
     alert('foo'); 
    }; 

    dep.prototype.fn = function() { 

    }; 

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

})();