使用webpack ou npm在多個包中拆分javascript Javascript項目

Question

我正在嘗試構建一個必須在Windows（PC），Android和iOS上運行的應用程序。

為此，我將使用Electron（用於Windows）和React Native（用於移動平台）。 兩者都將使用React和Redux構建。 這樣，我將能夠在Redux Reducer和中間件中實現邏輯，並在兩個項目中使用它們。

從現在開始，我使用webpack為Electron app做了POC。 Reducer目前直接在應用程序代碼中。 我想在一個單獨的包中提取Redux相關代碼，以允許我在React Native項目中使用它。

我可以為包含reducers和middlware的Redux模塊制作一個npm包，但這樣，當我編譯我的應用程序時，webpack將不會編譯我的單獨包，它將使用預編譯版本。

所以我想要的是能夠創建一個單獨的包，但仍然在應用程序編譯時編譯它（因為它仍處於開發階段，並且dev與主應用程序開發人員密切相關）。

我是否只能使用npm或webpack進行此操作？

我是Javascript dev堆棧的新手。

Answer 1

我認為你有不同的方法來處理這個問題。

1. 您可以使用NPM包。 但是在包的代碼中，您不僅會存儲原始源代碼，還會存儲編譯代碼。 我的意思是在發布該包之前，您需要在普通的ES5代碼中編譯它。
2. 我想你可以使用Git提供的子模塊系統。 您應該有一個單獨的存儲庫，其中包含reducers的公共代碼。 在每個項目（電子，RN等）中，您將擁有一個帶有git子模塊的目錄。 Webpack應該正常編譯該目錄中的代碼而沒有任何問題。

UPD：

關於子模塊你可以在這里閱讀好文章： https ： //git-scm.com/book/en/v2/Git-Tools-Submodules#Starting-with-Submodules

簡而言之，在項目中它看起來像：

cd yourProjectFolder
git submodule add https://github.com/TalAter/awesome-service-workers submoduleDirectoryName

它將克隆存儲庫到您的項目，並創建.gitmodules文件。 子模塊中的代碼在當前項目存儲庫中不存在。 在遠程存儲庫中，它只包含子模塊的鏈接，但在您的機器上，您將擁有完整的代碼，您將能夠編譯它。