javascript - 使用 webpack ou npm 在多个包中拆分 javascript Javascript 项目

Question

我正在尝试构建一个必须在 Windows(PC)、Android 和 iOS 上运行的应用程序。

为此，我将使用 Electron(适用于 Windows)和 React Native(适用于移动平台)。两者都将使用 React 和 Redux 构建。这样，我将能够在 Redux reducer 和中间件中实现逻辑，并在两个项目中使用它们。

从现在开始，我已经使用 webpack 为 Electron 应用程序完成了 POC。 reducer 目前直接在应用程序代码中。我想将 Redux 相关代码提取到一个单独的包中，以允许我在 React Native 项目中使用它。

我可以为我的 Redux 模块制作一个包含 reducer 和中间件的 npm 包，但是这样，当我编译我的应用程序时，webpack 将不会编译我的单独包，它将使用预编译版本。

所以我想要的是能够制作一个单独的包，但仍然在应用程序编译时编译它(因为它仍在开发中并且开发与主应用程序开发密切相关)。

我必须只使用 npm 还是同时使用 webpack 来完成它？

我是 Javascript 开发栈的新手。

Answer 1

我认为您有不同的方法来处理该问题。

1. 您可以使用 NPM 包。但是在包的代码中，您不仅会存储原始源代码，还会存储编译后的代码。我的意思是在发布那个包之前，你需要用普通的 ES5 代码编译它。
2. 我认为你可以使用 Git 提供的子模块系统。您应该有单独的存储库，其中包含您的 reducer 的通用代码。在每个项目(Electron、RN 等)中，你都会有一个包含 git 子模块的目录。 Webpack 应该可以正常编译该目录中的代码，没有任何问题。

更新:

关于子模块，您可以在这里阅读不错的文章: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 文件。来自子模块的代码将不存在于当前项目存储库中。在远程存储库中，它将只包含到子模块的链接，但在您的机器上，您将拥有完整的代码并且能够编译它。