如何在不经过构建周期的情况下设置具有多级依赖关系图的 Typescript 单存储库？

编程问答 2022-11-21

问题描述

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

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

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

漫长的一天。

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

我的一天从在 tsconfig.json 中定义 paths field 开始：

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

我很快意识到我不得不放弃 create-react-app，因为它不支持 paths alias。尝试使用不同的 CRA 重新布线技术使我想到了可怕的 invalid hook call，这意味着 react 不知道如何解析不同版本的 react-dom。调整 noHoist 并没有帮助解决它，也没有按照他们的文档中的建议进行符号链接。

总结随后的尝试：

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

我正在寻找一种解决方案，用于运行带有任何捆绑器的开发环境，用于根 SPA 包和多个相互依赖的打字稿包，无需 fs 监视和构建周期。

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

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

monoreposnowpacktypescripttypescripttypescriptwebpackwebpackwebpack