Class 不是 Angular 模块 - 仅在 IntelliJ/Webstorm 中导入本地构建 Angular 库时

Question

我正在尝试使用 Angular 库（项目）中实现的模块，该模块存在于单独的 Angular 应用程序中。在 IntelliJ 中，我收到一个错误 Class MyModule is not an Angular module 并且在 IntelliJ 中似乎无法识别所有库，而我可以成功地运行 ng build 这个项目。更奇怪的是，我实际上有两个 Angular 库存在于另一个 Angular 应用程序中，我可以毫无问题地使用另一个库中的模块。

我已经访问过与 class is not an Angular module 相关的其他看起来相似的问题，但它们似乎并不相关。

Answer 1

这是我思考几个小时后找到的答案。我如何在主项目中使用有问题的库是：

npm link 在 lib

build

npm link @my-org/my-new-lib 在应用程序中我发现了问题。

连同 ng build @my-org/my-new-lib --watch 库，这让我可以同时处理这两个项目，在目标应用程序中立即看到结果。

这个问题显然是由于 IntelliJ 中的错误 - https://youtrack.jetbrains.com/issue/WEB-38354?_ga=2.263408847.258701770.1571260138-1443411092.1565629801 - 它导致路径中 dist 的依赖项被自动排除，即使库已正确链接到目标应用程序的 node_modules IntelliJ 将其排除在外，因此该库实际上在 IDE.

中不可用

解决方法（类似于 jetbrains 票中建议的方法）是在目标应用程序的 IDE 中进入符号链接 node_modules/@my-org/my-new-lib - 右键单击它并选择 将目录标记为 -> 不排除

希望这可以为某人节省一些时间，因为它确实令人困惑且难以克服。

Answer 2

我在一个 Angular 9+ 项目中遇到了类似的问题。如果是这种情况，您应该启用一个 IntelliJ 选项来完成这项工作。基本上，它支持 d.ts 中的 Ivy 元数据，这是问题的原因。

访问 IntelliJ 的注册表（Cmd/Ctrl-Shift-A 并在搜索栏中输入 Registry）
寻找 angular.enableIvyMetadataSupport 并激活它。
重启 IDE

然后您就可以轻松使用图书馆了

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

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { AttachmentModule } from "attachment"; // <- This is the Library

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    AttachmentModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

如果有人想了解更多详情，请阅读此处https://blog.jetbrains.com/webstorm/2020/02/using-angular-9-in-webstorm/

Answer 3

对于那些运行使用 Angular 10+ 解决这个问题的人，我遇到的问题是我导入了一个我以前没有使用过的模块（在我的例子中，OverlayModule）， Angular 跳过了 Ivy 编译阶段的模块，例如。 Compiling @angular/cdk/overlay : es2015 as esm2015 的部分。我的解决方案是重新运行 ng serve。 Intellij 然后能够将导入视为 Angular 模块。

我在 ng 服务之间运行安装了一个 npm，但我认为这一步不是必需的，因为 Angular CLI 是进行编译的那个，而且我没有'自上次安装以来更改了任何依赖项。

Class 不是 Angular 模块 - 仅在 IntelliJ/Webstorm 中导入本地构建 Angular 库时

Class is not an Angular module - only in IntelliJ/Webstorm when importing locally build Angular library

intellij-idea

angular

angular-library