angular-cli库创建辅助入口点

Question

我正在尝试在我的角度npm包中创建我认为称为辅助入口点的东西。我想要以下两个切入点

@scope/data-service
@scope/data-service/models

使用angular-cli生成基本包会生成以下结构

scope
????data-service
    ?   karma.conf.js
    ?   ng-package.json
    ?   ng-package.prod.json
    ?   package.json
    ?   tsconfig.lib.json
    ?   tsconfig.spec.json
    ?   tslint.json
    ?
    ????src
        ?   public_api.ts
        ?   test.ts
        ?
        ????lib
                data-service.component.spec.ts
                data-service.component.ts
                data-service.module.ts
                data-service.service.spec.ts
                data-service.service.ts

根据ng-packagr 文档，您可以在名为datas的数据服务下添加一个文件夹，然后package.json在该文件夹中添加第二个文件夹，但是ng-packagr似乎使用的结构与angular-cli略有不同。理想情况下，我正在尝试对类似于https://github.com/angular/angular/tree/master/packages/common的结构进行建模，但只要公开了@scope/data-service，@scope/data-service/models我就会很高兴。

当我尝试创建类似于ng-packager建议的结构时，我得到了

error TS6059: File 'C:/projects/data-service-app/projects/scope/data-service/models/src/index.ts' is not under 'rootDir' 'C:\projects\data-service-app\projects\scope\data-service\src'. 'rootDir' is expected to contain all source files.

当我将models目录移动到data-service\src目录中时，我的入口点是

@scope/data-service
@scope/data-service/src/models

如何摆脱二级入口上的src？

使用angular-cli时，使用辅助入口点创建库的正确方法是什么？

Answer 1

恐怕这对 ng-packagr 来说不是一件容易的事。

对于您尝试打​​包的每个“项目”，ng-packagr 会自动检测所有辅助包。

ng-packagr忽略 tsconfig.lib.json二级包的文件，它将使用主包提供的 tsconfig 文件。

然后，在编译之前，它会使用主节点的 tsconfig 加载主节点和所有辅助节点的 TS 程序。

这样做是这样的，这样打包器就可以解析代码并创建一个依赖树，它会告诉它首先渲染哪个包，第二个等等...... 是的，这也意味着 ng-packagr 不假设第二个包总是取决于主要的，它可能是另一种方式，它是有效的......

现在，到目前为止一切都应该没问题，没有错误等......为所有包创建了一个 TS 程序，但没有发出任何东西，所以一切都很好。

您看到的错误出现在编译阶段，编译器尝试发出文件并抛出。这是 ng-packagr 记录“通过 ngc 编译 TypeScript 源”的时间

在这一点上，打字稿对根目录之外的文件的引用并不满意，就是这种情况。

一种解决方案是更新paths属性tsconfig以指向构建的每个包的输出目录。因此，如果包 A 刚刚编译，我们更改/创建paths指向输出库的记录，该记录不会被视为 TS 源......因此没有错误。

这会起作用，我已经对其进行了测试，但遗憾的是，它需要在ng-packagr源代码中进行一些工作，或者像我所做的那样，使用自定义的 angular devkit 构建器...

有了它，您可以paths在每次编译完成后替换right，因此下一次编译将引用构建的输出而不是源代码。

因为 ng-packagr 基于依赖图构建包，所以我们可以安全地假设这会起作用。

Answer 2

谢谢回复。这是我最终得到的解决方案，全部围绕正确设置index.ts和public_api.ts文件

\---projects
    \---scope
        \---ngx-package
            |   karma.conf.js
            |   ng-package.json
            |   ng-package.prod.json
            |   package.json
            |   tsconfig.lib.json
            |   tsconfig.spec.json
            |   tslint.json
            |
            \---src
                |   public_api.ts
                |   test.ts
                |
                +---lib
                |       package-client-config.ts
                |       package-client.spec.ts
                |       package-client.ts
                |       package.module.ts
                |
                \---models
                    |   index.ts  (1)
                    |   package.json (2)
                    |   public_api.ts  (3)
                    |
                    \---src
                        |   public_api.ts  (4)
                        |
                        \---lib
                            |   model-a.ts
                            |   model-b.ts
                            |
                            \---hateoas
                                    hateoas.ts

好了，在上面的树中，请注意带有数字的内部括号与下面的文件相对应。

1）/projects/scope/ngx-package/src/models/index.ts

\---projects
    \---scope
        \---ngx-package
            |   karma.conf.js
            |   ng-package.json
            |   ng-package.prod.json
            |   package.json
            |   tsconfig.lib.json
            |   tsconfig.spec.json
            |   tslint.json
            |
            \---src
                |   public_api.ts
                |   test.ts
                |
                +---lib
                |       package-client-config.ts
                |       package-client.spec.ts
                |       package-client.ts
                |       package.module.ts
                |
                \---models
                    |   index.ts  (1)
                    |   package.json (2)
                    |   public_api.ts  (3)
                    |
                    \---src
                        |   public_api.ts  (4)
                        |
                        \---lib
                            |   model-a.ts
                            |   model-b.ts
                            |
                            \---hateoas
                                    hateoas.ts

2）/projects/scope/ngx-package/src/models/package.json

{
  "ngPackage": {}
}

3）/projects/scope/ngx-package/src/models/public_api.ts

// export what ./public_api exports so we can reference models like
// import { modelA } from './models'
export * from './public_api';

4）/projects/scope/ngx-package/src/models/src/public_api.ts

{
  "ngPackage": {}
}

使用此设置，您只需要将出口清单保存在一个地方。我尝试了许多其他变种，但都没有用，这似乎没有问题。