的WebPack暴露錯誤的塊存儲爲庫

Question

我設計了一種旨在導入爲<script>標籤暴露了一個全球性的，就像一個JavaScript庫：

<script src="mapboard.js"></script> 
<script> 
    Mapboard({...}); 
</script> 

我使用的WebPack捆綁和分發。我的配置是這樣的：

module.exports = { 
    entry: { 
    lib: './src/main.js', 
    vendor: [ 
     'leaflet', 
     'vue', 
     'vuex' 
    ], 
    }, 
    output: { 
    path: path.resolve(__dirname, './dist'), 
    publicPath: '/dist/', 
    filename: '[name].js', 
    library: 'Mapboard' 
    } 

我想使它所以全球Mapboard只露出大塊lib。目前它由於某種原因暴露了其中一個供應商庫（vuex）。有誰知道如何做到這一點？

Answer 1

您不應該爲庫使用多個入口點。所有參賽作品將以相同的名稱和上次加載的「勝利」來公開其出口。如果你確實需要多個庫，你也可以使用[name]的output.library。

但它看起來像你試圖實現別的東西，即不要將依賴關係與庫捆綁在一起。在這種情況下，您應該使用externals，這需要庫的用戶安裝依賴項（如Vue）。這與peerDependencies如何用於npm包非常相似。欲瞭解更多信息，你應該閱讀官方文檔的Authoring Libraries Guide。

如果您只想創建一個現成可用的庫，那麼您應該將它全部放在一個包中。