如何使用辅助端点为 Angular 库创建 API [英] How to use secondary endpoints to create API for Angular library

问题描述

场景:

我使用 ng-packagr 创建了一个自定义 UI 库，导出了自定义 components 和一些模型类.

I created a custom UI library using ng-packagr, exported custom components and some model classes.

问题:

在主项目中，import 语句适用于导出的组件，但不适用于导出的类，并且 webpack 无法编译并给出错误:

In main project, import statement works fine for exported components but it doesn't work for exported classes and webpack fails to compile giving error:

找不到模块错误无法解决my-custom-library/models

module not found error can't resolve my-custom-library/models

库项目代码:

模型类:src/app/modules/my-custom-module/models/my-model.ts

export class MyModel {
  constructor() {
    // default values for props here
  }

  // ...props here
}

索引文件:src/app/modules/my-custom-module/models/index.ts

export * from './my-model';
export * from './my-other-model';

在根目录导出文件:models.ts

export * from './src/app/modules/my-custom-module/models/index';

ng-packagr 根文件:public_api.ts

export * from './models';

export * from './src/app/modules/my-custom-module/my-custom-module.module';
export * from './src/app/modules/my-custom-module/components/index';

主要项目代码:

import {MyCustomModule} from 'my-custom-library'; // works
import {MyModel} from 'my-custom-library'; // works
import {MyModel} from 'my-custom-library/models'; // does not works

目的:为最终开发者简化和划分 UI 库 API.

Purpose: Simplifying and dividing the UI library API for end developers.

我相信，我在映射 webpack 模块分辨率方面遗漏了一些东西，因为 VS Code 可以识别 import，intellisense 工作，甚至 Ctrl + Click 导航到正确的文件，但 webpack 编译失败.

I believe, I'm missing something about mapping webpack module resolution because VS Code recognizes the import, intellisense works and even Ctrl + Click navigates to right file but webpack fails in compilation.

Git 问题

推荐答案

我能够使用 次日终点.

I was able to achieve my required API pattern using Seconday End Points.

致谢:Alan Agius 在 Git 问题

这篇关于如何使用辅助端点为 Angular 库创建 API的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！