【发布时间】：2020-05-22 22:09:12
【问题描述】：
问题
我的 html 文件警告我的自定义组件/管道“不是已知元素”。但是，构建和运行应用程序按预期工作，并且自定义组件/管道可以正常工作。组件工作但显示为错误的二分法令人讨厌，并且可能难以使用。我知道这是一件小事，但我真的不想在没有错误的情况下在我的 html 文件中看到错误。
总结
我有两个不同的角度项目；我使用我的 Angular 应用程序使用的 Angular 库。该库导出应用程序使用的几个自定义组件、管道和服务。我没有通过 npm 发布这个库，而是使用 npm-link 让应用程序访问该库。这似乎可以像我的应用程序组件中定义的任何服务/组件一样工作并且不会抱怨。虽然当我从库中将任何内容放入模板文件时，该选择器带有下划线并出现警告。
文件
/*Library Module*/
@NgModule({
declarations: [
ThemeToggleComponent,
// Other custom components/pipes
],
exports: [
ThemeToggleComponent,
// Other components needed in templates files
]
})
export class MyCommonModule {}
/*
* Public API Surface of my-common library
*/
export * from './lib/my-common.module';
/*
* Many other components, services, pipes, etc etc
*/
export * from './lib/theme-toggle/theme-toggle.component';
/* Consuming Application module */
import { MyCommonModule } from 'my-common';
@NgModule({
imports: [
MyCommonModule,
],
declarations: [
MyComponent,
],
})
export class MyModule {}
/* Template of MyComponent, my.component.html */
<div>
<my-theme-toggle (darkThemeSelected)="toggleTheme($event)"></my-theme-toggle>
</div>
上面的文件将所有引用我的自定义组件的行都用红色下划线并带有错误消息 'my-theme-toggle' is not a known element: ...如果是，请验证它是否属于模块。
尝试修复
我尝试了一些东西，但没有成功
- 不使用 NPM 链接，只是将 ng-packagr 创建的库复制到我的应用程序的节点模块中
- 重建和重新链接/重新启动一切
- 搜索其他 S.O 问题：大多数问题与构建失败有关，因为导入/导出实际上不正确。
我的预感
我认为这是使用应用程序中 tsconfig.json 中的 paths 编译器选项的问题。在我所有的研究中，这是最重要的一件事。我目前没有设置路径，因为一切正常。除了这个问题之外，我的公共库看起来和行为都与任何其他 node_module 库一样。
我的另一个想法是，因为一切正常并运行，所以问题可能是 vs-code 不理解导入，或者类似的东西。虽然我认为这不太可能。
背景
这两个 Angular 项目都在版本 9，rc7 上。我使用 ng-packagr 来构建我的库。我使用 Visual Studio 代码，在撰写本文时，我使用的是最新版本。
编辑 这个问题在升级到 Angular 11 后就消失了，我认为其他几个问题可能会解决它，但这感觉是最好的选择。
【问题讨论】：
-
可能vs代码不理解符号链接，如果你改为
npm install <path-to-library>呢？ -
@JasonWhite 我的想法也是如此，但是执行您的建议导致将我的库直接复制到 node_modules 中的结果相同。一切正常，但仍然在我的 .html 文件中出现错误。
-
也许在他们的 Github 页面上打开一个问题？
-
看起来像语言服务器does not support ivy。他们说要解决此问题，请在库上运行带有
--prod标志的构建，然后运行 Restart Angular Language Service。 -
@GetOffMyLawn 我认为这正是我遇到的问题，感谢您为我指明正确的方向。
标签： html angular typescript npm visual-studio-code