使用webpack作爲React npm包的構建工具

我一直在玩webpack和npm註冊表。我創建了我的own little project.，我發佈到npm註冊表。一切似乎都很好，但有一件事讓我擔心。使用webpack作爲React npm包的構建工具

由webpack構建的文件（lib/index.js）包含近2k行代碼，而我的庫非常小。我看到它包含兩個依賴關係，我使用的是prop-types和detect-browser。他們製作大部分代碼。在下載這兩個庫並在測試項目中使用它們之後懸停，我希望它們以某種方式被樹形或類似的東西重複地刪除，但是我的包的大小仍然相同。

基本上，我所問的只是：我的圖書館是否包含比必要的代碼更多的代碼？這對我來說似乎是這樣。

我也試着加裝prop-types和detect-browser的測試項目，看是否集束大小將保持不變。降低我的庫的大小仍然是一樣的，捆綁的大小增加了（我預計冗餘庫將被刪除或某物）。

來源

2017-11-11 Tomasz

您是如何生成依賴關係圖的？

順便說一下，您的包裹看起來很好，除了您的包裹分佈式代碼都取決於您的包裹（prop-types和detect-browser）。

爲了避免你應該在你的webpack配置文件中標記爲external這些庫。像：

externals: { 
    react: 'react', 
    prop-types: 'prop-types', 
    detect-browser: 'detect-browser', 
}

只是最後的（個人）注：給Rollup嘗試捆綁存儲庫。 :)

來源

2017-11-11 15:59:40

我用webpack捆綁分析器的依賴關係圖。爲什麼像'react-bootstrap'這樣的庫只有'react'和'react-dom'標記爲externals？ ReactBootstrap也使用'prop-types'和其他庫作爲它們的依賴關係。順便說一句，你的片段是無效的;） – Tomasz

react-bootstrap有一個相當複雜的[構建設置]（https://github.com/react-bootstrap/react-bootstrap/tree/master/tools）。我不知道那裏發生了什麼！ –

使用webpack作爲React npm包的構建工具

回答

相關問題