如何在 WebStorm / PhpStorm 中启用自定义 Angular 库的自动导入？答案

【问题标题】：How to enable auto import for custom Angular library in WebStorm / PhpStorm?如何在 WebStorm / PhpStorm 中启用自定义 Angular 库的自动导入？
【发布时间】：2020-05-13 17:48:52
【问题描述】：

我正在尝试创建一个 Angular 9 库，其中包含我在不同项目中使用的一些组件和类。我做了什么：

ng new my-lib-project --create-application=false
cd my-lib-project
ng generate library my-lib --prefix lb
我在 projects/my-lib/src/lib/ 中创建了一个 test-class.ts 文件，其中包含一个简单的 LibTestClass 定义（见下文）
我在 public-api.ts 文件中添加了 export * from './lib/test-class'; 行。
我打电话给ng build my-lib并将结果复制到myOtherProject/node_modules/

问题： 当我在 myOtherProject 的 app.component.ts 文件中输入 const test = new LibTestClass(); 时，PhpStorm 没有显示导入提示，以便轻松添加 TestClass 的导入行。如何使此自动导入适用于我的自定义库？

更多信息：

IDE：PhpStorm 2020.1.1
操作系统：MacOS
角度：9.1.6
my-lib 未发布到 npm

test-class.ts：

export class LibTestClass {

  private test = '';

  constructor() {}
}

【问题讨论】：

您是否将my-lib 添加到myOtherProject 的package.json 中？间接依赖（package.json 中未列出的依赖）未编入索引，因此没有完成/自动导入/等可用
@lena，我没有将 my-lib 添加到 package.json，因为我认为我不必这样做。如果 my-lib 没有发布到 npm 怎么添加呢？

标签： angular intellij-idea phpstorm webstorm angular-library

【解决方案1】：

感谢@lena，我找到了答案：为了为您的 Angular 库启用导入提示，您必须为您的库构建安装一个（本地）依赖项。就我而言，解决方案是：

npm install --save ../my-lib-project/dist/my-lib

这将创建一个指向您的库的本地构建的链接，并在您构建您的库时自动更新。我建议在开发中使用ng build --watch。

【讨论】：