2

我有一个包含 3 个包的 typescript mono-repo，如下所示：

  • 包 A：使用包 B 和 C 的 React 单页应用程序。
  • 包 B：一个使用包 C的 UI 库。
  • 包 C：具有 3rd 方依赖项的实用程序包。

我的目标是避免在开发过程中每次更改依赖项后的构建周期，因此我想直接使用包 B 和 C 的打字稿源代码，并可能享受 HMR（热重载）。

这是漫长的一天。

如果您希望避免我对我迄今为止的不同尝试的描述并直接跳到问题，请跳到最后两段。

我的一天从定义路径字段开始tsconfig.json：

{
  "compilerOptions": {
    ...,
    "baseUrl": "../",
    "paths": {
      "@package-b": ["path-to-package-b"],
      "@package-c": ["path-to-package-c"]
    }
  },
}

我很快意识到我必须留下create-react-app因为它不支持路径 alias。尝试使用不同的 CRA 重新布线技术导致我遇到可怕的无效挂钩调用，这意味着react不知道如何解决不同版本的react-dom. 调整noHoist并没有帮助解决它，也没有按照他们的文档中的建议进行符号链接。

总结随后的尝试：

  • 我尝试过使用yalc。当与 CRA 一起使用时，它似乎仍然需要一个构建周期，create-react-app因为它不编译依赖项。
  • 我已经尝试过自定义webpack构建。没有成功使它工作。确实花了很多时间让资产加载器 识别我的图像。
  • 我试了一下雪包。与名为@fluentui/react的第 3 方有问题，它无法编译并导致我遇到一个未解决的问题。我意识到我必须分叉并调查它才能继续并决定继续前进。
  • 我什至查看了硬链接目录，bindfs但似乎你需要macFuse它，它在安装过程中要求广泛的系统扩展权限。
  • 我目前正在尝试vite，它snowpack也支持native esmodules当你试图避免构建周期时很有希望。

我正在寻找一种解决方案，可以使用任何捆绑器为根 SPA 包和多个 typescript 包运行开发环境，这些包相互依赖，无需 fs-watching 和构建周期。

在将此问题标记为"primarily opinion based"注意之前，一个好的答案可以帮助未来的读者避免我今天所做的来回尝试。在这方面， Eventhis can be done with any bundler by leveraging this or that option是一个很好的答案。

4

0 回答 0