Angular库组件模板可用但代码引用报错，如何解决？

这个问题的核心原因很明确：你的my-library库目前只通过public-api.ts对外暴露了DummyModule，但没有直接导出DummyComponent。Angular库的对外访问权限完全由public-api.ts控制——只有在这个文件里显式导出的内容，外部应用才能直接引用到。

咱们有两种可行的解决方案，你可以根据自己的需求选择：

方案一：直接在public-api中导出组件（最直接的方式） #

如果你需要在应用代码里直接引用DummyComponent，最简单的做法就是把组件也加入到public-api.ts的导出列表中：

1. 打开库项目里的public-api.ts文件，添加一行导出组件的代码：

   export * from './lib/dummy/dummy.module';
   export * from './lib/dummy/dummy.component'; // 新增这行，暴露组件
   

2. 重新构建你的库（如果是本地开发的库，执行ng build my-library；如果是通过npm link链接的，确保重新构建后链接的内容更新）
3. 回到你的应用项目，现在就可以在app.component.ts里正常导入组件了：

   import { DummyComponent } from 'my-library';
   

方案二：保持封装性的同时访问组件（适合注重模块化规范的场景） #

如果你不想直接把组件暴露到库的顶层API，希望保持模块的封装性，其实还是可以通过模块间接获取组件，但这种方式更适合动态创建组件的场景：

1. 确保DummyComponent在自身文件中已经是导出状态（你应该已经做到了，因为模板能正常使用）
2. 在应用中导入DummyModule后，可以通过模块的exports数组获取组件：

   import { DummyModule } from 'my-library';
   
   // 获取组件类
   const DummyComponent = DummyModule.exports.find(comp => comp.name === 'DummyComponent');
   

不过这种方式比较繁琐，而且不够直观，所以更推荐方案一，除非你有特别的封装需求。

总结一下：模板能使用组件是因为DummyModule导出了它，但代码层面的直接引用需要组件本身被显式加入到public-api.ts的导出列表中，这是Angular库的API管控机制决定的。

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