2016-06-07 81 views
3

最近,我開發了一個React組件並希望發佈它。
如何捆綁模塊而不依賴發佈npm包

在這個包中,

"dependencies": { 
    "react": "^0.14.6", 
    "react-dom": "^0.14.6", 
    "react-timer-mixin": "^0.13.3" 
} 

當我通過webpack命令構建包,我會得到含有react, react-dom and react-timer-mixin束。
這種做法似乎是錯誤的...

因此,我的問題是如何構建沒有依賴發佈的軟件包。

*我認爲分離主包和依賴關係的chuck-vendor方法是針對多個包文件的。但我的要求是建立lib。

+0

我已添加一些內容來回復您。謝謝! – WendellLiu

+0

是的,我同意,你的情況實際上有點不同。我刪除了我的評論。 –

回答

2

如果您正在構建庫,則需要將這些依賴關係註冊爲externals

總而言之,只需在您的webpack配置中添加externals屬性,並將其設置爲包含要排除的模塊的名稱(字符串)的數組。

更復雜的情況可能需要您指定應該如何將導入系統的功能導入您的依賴項。你可以使用一個對象來實現這一點。

Here is the official example

module.exports = { 
    output: { 
     libraryTarget: "umd" 
    }, 
    externals: [ 
     "add", 
     { 
      "subtract": { 
       root: "subtract", 
       commonjs2: "./subtract", 
       commonjs: ["./math", "subtract"], 
       amd: "subtract" 
      } 
     } 
    ] 
} 

See here for more information about library and externals

如果您使用的是ES 2015和babel 6,則可能會遇到導出庫爲模塊對象而不是您想要的組件(例如您的組件)的問題。 Have a look at this question來解決它。

+0

謝謝你的回答! – WendellLiu

0

也許你應該用peerDependencies來代替。然後你可以在沒有webpack的情況下進行發佈。如果你使用ES6,你需要的只是一個babel transpilation步驟。

像這樣的東西往往是不夠

babel ./src -d ./lib 

同行的依賴會讓NPM知道使用你的包應該安裝這些依賴項目。