如何创建角度组件作为库的一部分并在我的应用程序中使用它

Question

所以我有以下情况

1. 我创建了一个角度库

   ng generate library my-lib

2. 我使用

   Ng generate component .lib/test

   添加了一个简单的组件，它创建了一个独立的组件 像这样

import { Component } from '@angular/core';

@Component({
  selector: 'lib-test',
  standalone: true,
  imports: [],
  templateUrl: './test.component.html',
  styleUrl: './test.component.css'
})
export class TestComponent {

}

3. 然后我通过运行

   ng build

   然后运行

   cd ../../dist/my-lib && npm pack

来打包我的应用程序
4. 我转到我的主应用程序并运行

   npm install {pointTofolder}/dist/my-lib/my-lib-0.0.1.tgz

5. 我在我的应用程序中使用时出现以下错误

“lib-test”不是已知元素：

1. 如果“lib-test”是 Angular 组件，则验证它是否是该模块的一部分。
2. 如果“lib-test”是 Web 组件，则将“CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“@NgModule.schemas”以抑制此消息。

我错过了什么/做错了什么？这是使用库中组件的最简单示例

Answer 1

我使用了这两个链接

独立组件 NG8001：“组件”不是已知元素 https://stackoverflow.com/a/65740167/2987066

这让我得出以下结论：

1. 确保路由正在导入该模块的导入和导出

    const routes: Routes = [
   {
    path: '',
    component: MyComponent,
    children: [
      {
        path: '',
        loadChildren: () => import('./routes/my/my.module').then(m => m.MyModule)
      },
    ]
   }];
   

然后确保您要加载的组件位于您刚刚加载的模块的导入和导出中

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule,
    RouterModule,
    TestComponent
  ],
    declarations: [

  ],
  exports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule,
    RouterModule,
    TestComponent
  ]
})