0

我們有我們正在整合到一個使用傳統的JS腳本網站的WebPack應用程序,然後將這些腳本定義全局變量。「導入全局變量」中的WebPack

裏面我們的WebPack的應用程序,我們要import一些圖書館碰巧已經是頁面腳本上。而不是下載相同的代碼兩次,一次是爲一個腳本,並再次嵌入的WebPack包裏面,我們想的WebPack不包括已在庫頁爲一個腳本的代碼,但仍然允許我們使用ES import語法來「導入」我們模塊中的代碼,儘管所討論的腳本代碼實際上是通過全局變量提供了庫。

所以,我們有我們的頁面上<script src="jquery.js">jquery.js理應不會是這樣的:

window.jQuery = {}; 

而在我們通過的WebPack編譯代碼,我們想要做的:

import jQuery from 'jquery'; 
jQuery === window.jQuery // true 

是否有任何方式的WebPack進行配置,以解決某些依賴關係,像在上面的例子中「的jquery」,並確定它應該變換import代碼到一個參考該全局變量?

此處的目的是逐步將選擇在我們的遺留應用程序的新代碼的新ES模塊語法,同時還服用的事實,同樣的代碼已經可以在頁面的腳本上的優勢。

我查了Webpack's guide on "shimming",但它似乎提供的每一個能力除了我在這篇文章中描述的

+0

這不是一個重複的問題。我在問如何*導入*某物。另一個問題是詢問如何排除某些東西。另一個人的意圖和答案恰好相同。 – Jackson

回答

2

使用的WebPack的externals

某些進口產品的捆綁預防,而是在運行時檢索 這些外部依賴。

externals: { 
    jquery: 'jQuery' 
}