2017-04-13 63 views
0

我正在使用Webpack 2並嘗試捆綁將用於我公司幾個項目中的公用庫。依賴包括vue,vue-router和其他一些。將這些供應商依賴關係打包到一個公共文件中似乎很有意義,然後將其作爲各種項目的外部對象包括在內。但我似乎無法得到這個工作。Webpack 2:構建多部分庫並用作外部

我的圖書館webpack.config.js包括線:

entry: { 
    common: [ 
     'vue', 
     'vue-router' 
    ] 
} 
... 
output: { 
    filename: '[name].js', 
    libraryTarget: 'var' 
} 

我的消費項目的webpack.config.js包括:

externals: { 
    'vue': 'Vue', 
    'vue-router': 'VueRouter' 
} 

我試過設置共同output.librarycommon和extern,例如,['common','Vue']。這不起作用。

我試過在庫和消費者上都設置了libraryTarget"amd",並且剛剛導致define未定義。如果我使用"var",那麼只有在我只包裝一個庫的情況下才能使用,如果我包裝多個庫,那麼這兩個庫都是未定義的。

是我想要做的可能嗎?謝謝。

回答

0

據我所知,你需要使用外部(如上),這就是全部。

然後你就可以得到你的外部依賴於「ES5方式」爲腳本標記(例如https://unpkg.com/[email protected]/dist/vue.runtime.min.js)或NPM,只是使用它。如果需要,也可以將它保存到* .js文件中。

Webpack創建捆綁包可能會從模塊(例如es 2015)或全局變量(es5)中獲得依賴關係。

所以在npm中已經存在用於外部庫的bundle。