最近在用webpack做一些是sdk相關的東西,有幾個概念總結一下:
1、library
要做sdk,一定要做的一個配置,用於說明最終的SDK暴露給調用者的一個名稱
例如:library: 'HelloJS',
外部調用的時候,就是HelloJS.method,import {**} from HelloJS,又或者是let a = require('HelloJS')
2、libraryTarget
是表示打包出去之後支持外部以一種什麼樣方式引入,global全局?commomJS的require還是ES6的模塊化improt * from HelloJS
一般情況下,我配置libraryTarget: 'umd',就是上面三種都支持,沒問題,這樣就對了
3、externals
表示很多時候我們用了第三方庫,但是又不想讓webpack將它打包到項目種,避免項目太大。這樣就可以通過配置externals
例如,我現在又一個demo,需要引入HelloJS,然後我在demo工程裏配置
externals{
HelloJS: ‘HelloJS’
}
此時demo代碼中可以寫import * from 'HelloJS',是可以在瀏覽器被執行的,雖然最後webpack並沒有將HelloJS打包到demo中,但是index.hmtl需要引用HelloJS,也就是說最終的index文件引入了webpack本身打包的bundle.js加上HelloJS