library是指定義一個(gè)全局使用的名稱變量,libraryTarget是指設(shè)置library的暴露方式简僧,是commonjs、commonjs2击困、umd還是this涎劈、var等.
library和libraryTarget是配合使用的。
libraryTarget:‘var’
默認(rèn)webpack導(dǎo)出都是這樣的結(jié)構(gòu)阅茶,一個(gè)自執(zhí)行函數(shù)的樣式蛛枚。
沒有賦值操作,所以其他文件沒法引用該對(duì)象脸哀。加了 library和libraryTarget 之后的 webpack 配置:
編譯后的文件如下所示:
特點(diǎn):有賦值操作蹦浦,賦值給 library 定義的變量。所以 libraryTarget:‘var’ 的含義就是作為全局變量撞蜂,具體變量的名字叫什么是通過 library 來定義的盲镶。
libraryTarget: “assign”
webpack 配置:
編譯后的文件如下所示:
特點(diǎn):賦值給全局變量, 可能會(huì)覆蓋宿主環(huán)境下同名的變量名蝌诡,因?yàn)槲覀兛吹阶兞渴侵苯邮褂玫母然撸]有通過 var 去聲明,和上面講到的第一種還是有區(qū)別浦旱。
libraryTarget: “this”
webpack 配置:
編譯后的文件如下所示:
通過對(duì)象屬性暴露宇色,這里是 this 對(duì)象,屬性是通過 library 來定義的颁湖。
當(dāng)然我們也可以掛在到 window 對(duì)象上宣蠕。
當(dāng)然我們也可以掛在到 global 對(duì)象上。
我們還可以定義在導(dǎo)出的對(duì)象上甥捺,方便其他庫導(dǎo)入進(jìn)來使用抢蚀。
當(dāng)然我們還有默認(rèn)導(dǎo)出,使用 libraryTarget 為 commonjs2 這個(gè)屬性镰禾。此時(shí) library 配置的字段會(huì)失效皿曲。所以我們可以省略。
這是 commonJS 規(guī)范吴侦,還有 amd 規(guī)范的形式谷饿。
libraryTarget:“umd” 的 webpack 配置: