如何在NX Monorepo中实现Stencil包构建时包含依赖的同仓Stencil包？

问题场景 #

基于StencilJS文档搭建了NX单体仓库，包含两个Stencil包Package-A与Package-B（未引入React库）。在Package-B中执行import '@nx-workspace/Package-A'后，本地运行正常，但构建时Package-A不会被打包到Package-B的dist文件夹。当前tsconfig.base.json里NX配置的路径如下：

"@nx-workspace/Package-A": ["dist/packages/Package-A"],
"@nx-workspace/Package-A/loader": [
  "dist/packages/Package-A/loader"
],
"@nx-workspace/Package-B": ["dist/packages/Package-B"],
"@nx-workspace/Package-B/loader": [
  "dist/packages/Package-B/loader"
]

解决方案 #

方案1：调整tsconfig路径指向源码而非构建产物 #

当前路径指向Package-A的dist构建文件，Stencil会将其识别为外部依赖，不会打包进Package-B。修改路径为指向Package-A的源码入口：

"@nx-workspace/Package-A": ["packages/Package-A/src/index.ts"],
"@nx-workspace/Package-A/loader": ["packages/Package-A/src/loader.ts"]

修改后，Stencil构建Package-B时会直接解析Package-A的源码，将其合并打包到自身的dist目录中。

方案2：配置Stencil的includeDependencies选项 #

如果希望保留路径指向dist目录，可在Package-B的stencil.config.ts中添加配置，强制打包指定依赖：

export const config: Config = {
  // 其他原有配置
  includeDependencies: ['@nx-workspace/Package-A']
};

该配置会让Stencil将指定的外部依赖打包到Package-B的输出目录中。

关于本地npm安装的疑问 #

不需要将Package-A通过npm安装到Package-B，单体仓库的核心优势就是共享源码或构建产物，通过上述两种配置即可解决问题，本地安装反而会增加冗余和维护成本。

关键注意事项 #

• 若使用方案1，需确保Package-A的导出在src/index.ts中正确暴露，保证Stencil能正确解析入口。
• 若路径仍指向dist目录，需在Package-B的构建脚本中添加依赖Package-A的构建步骤，比如使用NX命令：nx run-many --target=build --projects=Package-A,Package-B，确保构建Package-B前先完成Package-A的构建。

内容的提问来源于stack exchange，提问作者istepsv