2014-09-02 103 views
1

我有一個用AMD風格編寫的庫,可以與RequireJS一起使用。假定圖書館的用戶提供jqueryjquery-ui。說它看起來像這樣:使用webpack處理具有外部依賴關係的AMD庫

// main-lib.js 
define(['jquery', './aux-lib.js'], function ($) { ..(1).. }); 

// aux-lib.js 
define(['jquery', 'jquery-ui'], function ($) { ..(2).. }); 

我想弄清楚webpack的工作原理。例如,假設我想這些文件打包成一個單一的AMD樣式庫文件,該文件還假定jqueryjquery-ui從外面:

// out.js 
define(['jquery', 'jquery-ui'], function ($) { ..(1)..(2).. }); 

這是如何實現的呢?

當我運行main-lib.jsentry - 點的WebPack,它會抱怨它無法找到jqueryjquery-ui。如果我用resolve.alias配置正確的路徑,它將jqueryjquery-ui捆綁到out.js,這不是我想要的。我嘗試使用output.externals無濟於事。

回答

1

這是我的一個非常簡單,愚蠢的錯誤。相關字段不是output.externals,而只是externals。請參閱here。其他兩個相關領域介紹有output,但externals不是。可以是數組,也可以是數組。這是我目前的配置:

{ 
    entry: './main-lib.js', 
    output: { 
     path: './', 
     filename: 'out.js', 
     libraryTarget: 'amd' 
    }, 
    externals: ['jquery', 'jquery-ui'] 
} 

它的工作很好。

+0

因此,基本上你只是說「忽略jquery和jquery-ui」,那麼我認爲你的銀行業務是因爲你的代碼使用了全局變量的專有名稱(因此你爲什麼沒有指定全局變量這裏的名字)? – trusktr 2015-04-21 00:15:44

+0

我在說「不要把jquery和jquery-ui放在輸出庫中」。我根本沒有在全局變量上進行操作; jquery的輸出是通過模塊參數提供的。我不必知道全局變量名稱,因爲jquery碰巧是AMD意識到的。如果不是這樣,你會怎麼做? – mhelvens 2015-04-21 09:18:21