在npm上创建一个可用的库…使用纱线工作区

我正在寻找对我在修补时编码的模式的反馈。

语境

我正在为我的公司创建一个包，该包将公开发布。DX（开发者体验）对我们来说是最重要的，为此我选择了开发的最新趋势：Typescript、esm 等......我想提出多个模块并使导入易于使用，类似到（例如）nextjs 的next/Router.

[编辑]我发现了这个线程并交叉引用以供曝光。

第一步

我从一个简单的单个包开始我的第一次尝试，tsconfig 和 src/、tests/ 和 dist/ 文件夹。那里没有什么令人难以置信的异国情调，但如果你一直这样做，你就会知道发布它会导致你的导入路径dist稍后包含。

您可以使用 package.json 的main字段来解决此问题，但这仅适用于顶级模块；您可以使用exports，但它不适用于 Typescript。最简单的解决方法是cp package.json dist/ && npm publish dist/，到此，问题就解决了。

然后我想为了测试这个，我将成为npm link我的 dist/ 文件夹，虚拟地创建“一个包中的包”，几乎没有问题：

• 这部cp package.json dist/分会增长*.md，谁知道还有什么/它会如何增长（我不想有构建脚本文件）
• 我仍然需要构建一个测试应用程序来在 DX 级别测试我的库，以及在哪里托管它？

所以我想：为什么不把它全部提升为一个 monorepo 呢？

转折点

树结构将从：

myLib/
  package.json ? build + test + publish script
  tsconfig.json
  jest.config.json
  .npmignore ? managing what to distribute
  ...lots of config files
  src/
  dist/
  tests/

到：

myLib/
  package.json ? workspaces
  src-pkg/
    package.json ? build script
    tsconfig.json ? localized conf for build
  dist-pkg/
    package.json ? publish script
  test-pkg/
    package.json ? test script
    jest.config.json ? localized conf for test

要将构建的文件从src-pkgto传递dist-pkg，我只需要指向 tsc ( tsc --project . --outDir ../dist-pkg) 中的文件夹

甚至可以通过在顶级 npm 脚本中编排工作空间命令来恢复与单个包中相同的流程，例如：

{
  "workspaces": ["src-pkg", "test-pkg", "dist-pkg"],
  "scripts": {
    "build": "yarn workspace src-pkg run build",
    "test": "yarn workspace test-pkg run test",
    "publish": "yarn workspace dist-pkg run publish"
  }
}

退一步

这种结构的好处主要在 test-pkg 中。它可以轻松地随意测试 src-pkg 或 dist-pkg，因为这两种结构都应该是扁平的和相似的。这样，工作流可以在构建之前或之后进行测试。