如何引用index.html中包含的JavaScript庫中的類和方法

我有一個內置於React的SPA。我需要包含一個來自CDN的用於分析的JavaScript庫 - 不應該與其他JS庫捆綁在一起。如何引用index.html中包含的JavaScript庫中的類和方法

到目前爲止，我已經瞭解到，它不是webpack的工作，我應該使用腳本加載器，如scriptjs。我發現這個線程，但我不明白的實施：https://github.com/webpack/webpack/issues/240。

我需要：

包括來自CDN的JS庫。到目前爲止，我通過在Index.html頁面上引用它來完成此操作。（即<script src="//path/to/cdn/utag.js"></script>）
從React應用程序中的組件引用庫。有一個類utag與方法view()和link()，我需要在應用程序中按下按鈕時調用。如果我在反應組件的方法中嘗試utag.link（），則對象utag未定義，反應將無法編譯。

如何包含此庫以便它可以被我的所有組件訪問，以及如何引用我需要的類和方法？

謝謝！

來源

2017-08-30 user1521567

你做得對 - 只要將它包含到你的index.html。其餘的依賴於utag庫如何導出類。如果它只是定義了全局變量，那麼你可以通過window.utag來訪問它。 – pinebit

HTML中的腳本引用很好。

Analytics（分析），您可能希望構建一個包裝到你的應用程序處理事件和試驗的下游功能的可用性，沿着線：

var analytics = { 
    view: function(a,b,c){ 
    if(window.utag && window.utag.view && typeof window.utag.view == "function"){ 
     window.utag.view(a,b,c); 
    } else { 
     // handle lack of Tealium availability here 
    } 
    }, 
    link: function(a,b,c){ 
    if(window.utag && window.utag.link && typeof window.utag.link == "function"){ 
     window.utag.link(a,b,c); 
    } else { 
     // handle lack of Tealium availability here 
    } 
    } 
};

然後，您可以使用analytics.view（）和analytics.link（），並編寫代碼來處理未加載的Tealium（例如延遲一秒鐘，然後進行後續嘗試）。

來源

2017-10-02 08:35:15

如何引用index.html中包含的JavaScript庫中的類和方法

回答

相關問題