package - 如何在 Monorepo 中运行多个开发包

Question

我有一个使用 lerna 和 yarn 工作区的 monorepo 用于前端应用程序和库。我在根 package.json 中添加了一系列 npm 脚本，以管理每个包(应用程序、库、插件)，就像本文末尾的代码一样。问题是我的根 package.json 变得越来越大，我才刚刚开始。另一个问题是，如果我需要开发一个在 CRM 中使用的组件，在组件库中，它使用 i18n 库，我需要在 3 个单独的终端窗口中启动 3 个包，并且我可能有更多的依赖包需要同时开发。

我认为将 start:crm 放入安装在 CRM 中的每个包中(使用 --parallel)，我认为这不是一个好主意。

我看到一个例子，文件正在通过文件系统从另一个包导入(成为文件监视运行应用程序的一部分)，忽略包根文件夹，我担心这种方法，因为它破坏了版本控制.

你们是如何处理这些问题的？

"/** CRM SCRIPTS */": "",
"start:crm": "npx lerna run start --scope @kovi-cx-frontend/crm",
"build:crm": "npx lerna run build --stream --scope @kovi-cx-frontend/crm",
"test:crm": "npx lerna run test --stream --scope @kovi-cx-frontend/crm",
"lint:crm": "npx lerna run lint --stream --scope @kovi-cx-frontend/crm",
"codegen:crm": "npx lerna run codegen --scope @kovi-cx-frontend/crm",
"start:crm:storybook": "npx lerna run start:storybook --stream --scope @kovi-cx-frontend/crm",
"build:crm:storybook": "npx lerna run build:storybook --stream --scope @kovi-cx-frontend/crm",

Answer 1

这里必须使用适当的工具。

我遇到了类似的问题:具有数十个包的 Yarn 工作区深深地相互依赖。我的 package.json 看起来像这样:

{
  "scripts": {
    "all": "run-s \"generic all\" \"all:apps all\" --",
    "all:apps": "run-p --aggregate-output \"eslint-config {@}\" \"apps1 {@}\" \"apps2 {@}\" --",
    "apps1": "run-s \"apps1:deps {@}\" \"apps1:c {@}\" --",
    "apps1:c": "run-p --aggregate-output \"hatsy:c {@}\" --",
    "apps1:deps": "run-s \"route-match:c {@}\" --",
    "apps2": "run-p --aggregate-output \"siteparts:c {@}\" \"realworld-app:c {@}\" \"examples:c {@}\" --",
    "build": "run-s \"generic build {@}\" \"all:apps build {@}\" --",
    "lint": "run-p --aggregate-output \"generic lint {@}\" \"all:apps lint {@}\" --",
    "test": "run-p --aggregate-output \"generic test {@}\" \"test:apps test {@}\" --",
    "test:apps": "run-p --aggregate-output \"apps1:deps {@}\" \"apps1:c {@}\" \"siteparts:c {@}\" \"realworld-app:c {@}\" --",
    "a-iterable": "run-s \"call-thru {@}\" \"a-iterable:c {@}\" --",
    "a-iterable:c": "run-s -l \"a-iterable:x {@}\" --",
    "a-iterable:x": "yarn workspace @proc7ts/a-iterable",
    "call-thru": "run-s \"primitives:c {@}\" \"call-thru:c {@}\" --",
    "call-thru:c": "run-s -l \"call-thru:x {@}\" --",
    "call-thru:x": "yarn workspace @proc7ts/call-thru",
    "context-values": "run-s \"call-thru {@}\" \"context-values:deps {@}\" \"context-values:c {@}\" --",
    "context-values:c": "run-s -l \"context-values:x {@}\" --",
    "context-values:deps": "run-p --aggregate-output \"a-iterable:c {@}\" \"fun-events:c {@}\" --",
    "context-values:x": "yarn workspace @proc7ts/context-values",
    "delta-set": "run-s \"delta-set:c {@}\" --",
    "delta-set:c": "run-s -l \"delta-set:x {@}\" --",
    "delta-set:x": "yarn workspace @proc7ts/delta-set",
    "eslint-config": "run-s \"eslint-config:c {@}\" --",
    "eslint-config:c": "run-s -l \"eslint-config:x {@}\" --",
    "eslint-config:x": "yarn workspace @proc7ts/eslint-config",
    "fun-events": "run-s \"call-thru {@}\" \"fun-events:c {@}\" --",
    "fun-events:c": "run-s -l \"fun-events:x {@}\" --",
    "fun-events:x": "yarn workspace @proc7ts/fun-events",
    "hatsy": "run-s \"hatsy:deps {@}\" \"hatsy:c {@}\" --",
    "hatsy:c": "run-s -l \"hatsy:x {@}\" --",
    "hatsy:deps": "run-p --aggregate-output \"route-match {@}\" \"http-header-value:c {@}\" --",
    "hatsy:x": "yarn workspace @hatsy/hatsy",
    "http-header-value": "run-s \"http-header-value:c {@}\" --",
    "http-header-value:c": "run-s -l \"http-header-value:x {@}\" --",
    "http-header-value:x": "yarn workspace @hatsy/http-header-value",
    "route-match": "run-s \"primitives:c {@}\" \"route-match:c {@}\" --",
    "route-match:c": "run-s -l \"route-match:x {@}\" --",
    "route-match:x": "yarn workspace @hatsy/route-match",
    "input-aspects": "run-s \"input-aspects:deps0 {@}\" \"input-aspects:deps1 {@}\" \"input-aspects:c {@}\" --",
    "input-aspects:c": "run-s -l \"input-aspects:x {@}\" --",
    "input-aspects:deps0": "run-p --aggregate-output \"call-thru {@}\" \"namespace-aliaser:c {@}\" \"render-scheduler:c {@}\" --",
    "input-aspects:deps1": "run-p --aggregate-output \"a-iterable:c {@}\" \"fun-events:c {@}\" \"delta-set:c {@}\" --",
    "input-aspects:x": "yarn workspace @proc7ts/input-aspects",
    "namespace-aliaser": "run-s \"namespace-aliaser:c {@}\" --",
    "namespace-aliaser:c": "run-s -l \"namespace-aliaser:x {@}\" --",
    "namespace-aliaser:x": "yarn workspace @proc7ts/namespace-aliaser",
    "primitives": "run-s \"primitives:c {@}\" --",
    "primitives:c": "run-s -l \"primitives:x {@}\" --",
    "primitives:x": "yarn workspace @proc7ts/primitives",
    "render-scheduler": "run-s \"render-scheduler:c {@}\" --",
    "render-scheduler:c": "run-s -l \"render-scheduler:x {@}\" --",
    "render-scheduler:x": "yarn workspace @proc7ts/render-scheduler",
    "style-producer": "run-s \"style-producer:deps0 {@}\" \"style-producer:deps1 {@}\" \"style-producer:c {@}\" --",
    "style-producer:c": "run-s -l \"style-producer:x {@}\" --",
    "style-producer:deps0": "run-p --aggregate-output \"call-thru {@}\" \"namespace-aliaser:c {@}\" \"render-scheduler:c {@}\" --",
    "style-producer:deps1": "run-p --aggregate-output \"a-iterable:c {@}\" \"fun-events:c {@}\" --",
    "style-producer:x": "yarn workspace @proc7ts/style-producer",
    "examples": "run-s \"generic {@}\" \"examples:c {@}\" --",
    "examples:c": "run-s -l \"examples:x {@}\" --",
    "examples:x": "yarn workspace @wesib/examples",
    "generic": "run-s \"wesib {@}\" \"generic:deps {@}\" \"generic:c {@}\" --",
    "generic:c": "run-s -l \"generic:x {@}\" --",
    "generic:x": "yarn workspace @wesib/generic",
    "generic:deps": "run-p --aggregate-output \"http-header-value:c {@}\" \"input-aspects:c {@}\" \"style-producer:c {@}\" --",
    "realworld-app": "run-s \"generic {@}\" \"realworld-app:c {@}\" --",
    "realworld-app:c": "run-s -l \"realworld-app:x {@}\" --",
    "realworld-app:x": "yarn workspace @wesib/realworld-app",
    "wesib": "run-s \"wesib:deps {@}\" \"wesib:c {@}\" --",
    "wesib:c": "run-s -l \"wesib:x {@}\" --",
    "wesib:x": "yarn workspace @wesib/wesib",
    "wesib:deps": "run-p --aggregate-output \"context-values {@}\" \"namespace-aliaser:c {@}\" \"render-scheduler:c {@}\" --",
    "siteparts": "run-s \"generic {@}\" \"siteparts:deps {@}\" \"siteparts:c {@}\" --",
    "siteparts:c": "run-s -l \"siteparts:x {@}\" --",
    "siteparts:deps": "run-s \"route-match:c {@}\" \"hatsy:c {@}\" --",
    "siteparts:x": "yarn workspace @surol/siteparts"
  }
}

这绝对是的方法。

所以我创建了 run-z .

package.json 现在看起来像这样:

{
  "scripts": {
    "each": "run-z ...proc7ts ...hatsy ...wesib ...siteparts",
    "each:p": "run-z --bap ...dev-kit ...run-z ...each",
    "+dev-kit/*": "run-z +z ./dev-kit...dev-kit",
    "hatsy/*": "run-z +z ./hatsy// ./hatsy/kit/packages//",
    "proc7ts/*": "run-z +z ./proc7ts//",
    "+run-z/*": "run-z +z ./run-z//",
    "siteparts/*": "run-z +z ./siteparts",
    "wesib/*": "run-z +z ./wesib//",
    "z": "run-z +z:clean +z:test",
    "z:clean": "run-z +each:p/clean",
    "z:test": "run-z +each:p/lint,+each:p/cmd:jest/--runInBand"
  }
}

所以，现在我可以:

• 运行 yarn z clean build --all 重建所有包，
• 运行 yarn z build test --only hatsy 来构建和测试包的命名子集，
• 在特定包目录中运行 yarn build --with-deps 以构建它及其依赖项，
• 允许一些任务并行运行(例如 lint 和 test)，

...还有更多。

run-z 需要一些时间来学习，但结果令人满意。

顺便说一句，您可以在不安装的情况下试用它。例如。以下命令

npx run-z build:crm build:crm:storybook test:crm,lint:crm start:crm,start:crm:storybook

将构建 CRM 和故事书，然后测试和 lint(彼此并行)，然后启动 CRM 和故事书(再次，彼此并行)。