RequireJS定義回調返回錯誤的模塊依賴關係

Question

我對RequireJS有一個非常奇怪和令人沮喪的問題。當我調用具有一系列依賴項的模塊時，回調中可用的所有依賴項引用一個模塊。這可能是與代碼更容易解​​釋：

包括require.js腳本（沒有數據主要屬性）

<script type="text/javascript" src="/js/common/require.min.js" ></script> 

下面，我包括我的要求main.js（在網站的所有網頁中使用）在回調中需要我的頁面特定的js。

<script type="text/javascript"> 
    require(['/js/require/main.js'], function() { 
    require(['page/home_page']); 
    }); 
</script> 

main.js

requirejs.config({ 
    baseUrl: 'js/require' 
}); 

requirejs(['base'], 
function() { 
    var base = require('base'); 
    base.init(); 
}); 

home_page.js

define(['home','searchbar'], function (home,searchbar){ 

    console.log(home.init == searchbar.init); // This is always true !!! 

    home.init(); 
    searchbar.init(); 
}); 

home.js

define(function(){ 
    this.init = function(){ 
    console.log('in home page'); 
    } 
    return this; 
}); 

searchbar.js

define(function(){ 
    this.init = function(){ 
    console.log('Now in the searchbar init') 
    } 
    return this; 
}); 

問題出在home_page.js模塊home和searchbar引用同樣的東西。奇怪的是，現在我已經簡化了這個例子，它看起來很隨機，它選擇了哪一個。大多數時候它是搜索欄，但每隔幾次刷新它就會回家。

任何人有想法？這件事顯而易見嗎？

編輯：簡化的例子，並提供所有模塊的來源。

Answer 1

您正在分配到兩個模塊中的this。這不是一個好主意（原諒雙關）。在兩種情況下，this都可能是window對象。您可以通過添加一個

window.init === searchbar.init 

測試。

重寫模塊返回唯一對象，像這樣：

define(function() { 
    return { 
     init: function() { 
      console.log('in home page'); 
     } 
    }; 
}); 

和

define(function() { 
    return { 
     init: function() { 
      console.log('Now in the searchbar init'); 
     } 
    }; 
});