开发相互依赖的 npm 包的最佳工作流程
Best workflow for developing npm packages that depend on each other
目前我们正在开发两个基于 React 的应用程序,比如 app-a
和 app-b
,它们有两个我们也管理的依赖项。一个 shared-components
包,其中包含共享组件,以及一个 shared-utilities
包,其中包含 app-a
和 app-b
之间的共享实用程序。这两个在package.json上都有自己的full,并且包含在app-a
和app-b
的package.json中。
依赖关系:
app-a
|- shared-components
|- shared-utilities
和
app-b
|- shared-components
|- shared-utilities
每次我们在 shared-components
中开发我们想要在 app-a
中使用的东西时,我们必须执行太多步骤:
- 在
shared-components
中制作<AwesomeComponent />
- 在
shared-components
中构建文件。
- Commit/push 到 GitHub.
- package.json 中从
app-a
到特定分支的点依赖。
- 运行
npm install
.
- 使用
<AwesomeComponent />
.
如果我们在开发时出错,我们需要从第一步重新开始。当然我们可以通过将构建文件复制到node_modules
来跳过commit/push和npm install
文件夹,但是,每次我们构建组件时,这仍然是一件很麻烦的事情。
你们使用什么工作流程或任何 tips/advice 来加速本地开发?
注;我们正在使用 webpack 来捆绑我们的文件和 babel 来转译。
你想要的可能是npm link。
简单地说,在shared-components
中设置为sudo npm link
。这会在全局 npm 目录中创建符号链接(因此,如果您以 root 身份安装它,则需要提升权限)。
接下来您需要做的就是进入 app-a
和 运行 npm link shared-components
,这将用符号链接替换 node_modules
中的文件夹。
目前我们正在开发两个基于 React 的应用程序,比如 app-a
和 app-b
,它们有两个我们也管理的依赖项。一个 shared-components
包,其中包含共享组件,以及一个 shared-utilities
包,其中包含 app-a
和 app-b
之间的共享实用程序。这两个在package.json上都有自己的full,并且包含在app-a
和app-b
的package.json中。
依赖关系:
app-a
|- shared-components
|- shared-utilities
和
app-b
|- shared-components
|- shared-utilities
每次我们在 shared-components
中开发我们想要在 app-a
中使用的东西时,我们必须执行太多步骤:
- 在
shared-components
中制作 - 在
shared-components
中构建文件。 - Commit/push 到 GitHub.
- package.json 中从
app-a
到特定分支的点依赖。 - 运行
npm install
. - 使用
<AwesomeComponent />
.
<AwesomeComponent />
如果我们在开发时出错,我们需要从第一步重新开始。当然我们可以通过将构建文件复制到node_modules
来跳过commit/push和npm install
文件夹,但是,每次我们构建组件时,这仍然是一件很麻烦的事情。
你们使用什么工作流程或任何 tips/advice 来加速本地开发?
注;我们正在使用 webpack 来捆绑我们的文件和 babel 来转译。
你想要的可能是npm link。
简单地说,在shared-components
中设置为sudo npm link
。这会在全局 npm 目录中创建符号链接(因此,如果您以 root 身份安装它,则需要提升权限)。
接下来您需要做的就是进入 app-a
和 运行 npm link shared-components
,这将用符号链接替换 node_modules
中的文件夹。