如何让 vsCode 意识到自动完成的深度依赖导入?

问题描述

我创建了多个 Angular 库，让我可以使用一堆组件更快地创建网站，例如:sidenav、卡片、...

I've created multiple angular libraries which let me create website faster with bunch of components, eg: sidenav, cards, ...

我创建了一个超级库"；导入所有这些，这样我就可以使用 npm i myWebsiteBundle 一次下载所有依赖项.

I've created a "super library" that import all of them so I could just use npm i myWebsiteBundle to have every dependencies downloaded at once.

我已经在我的 ng-package.json 文件中列出了所有这样的插件

I've whiteListed every plugin like this in my ng-package.json file

  "whitelistedNonPeerDependencies": [
    "@myName/sidenav-conponent",
    "@myName/card-component",
  ]

但是现在，当我想在例如导入它时.app.module.ts vsCode 导入自动完成不会找到模块.

But now, When I want to import it in eg. app.module.ts the vsCode import autocompletion wont find the module.

import { SidenavComponentModule } from '@myName/card-component' // <-- Have to be typed manually

imports: [
  SidenavComponentModule // <-- No suggestion
]

我知道，建议单独下载每个包，但就我而言，它必须像这样实现

是否有人已经遇到过同样的问题并找到了解决方案?

Does somebody already have faced the same problem and did found a solution to it?

然后我尝试导出 public-api.ts 文件中的库

I did then tried to export the library inside the public-api.ts file

 export { SidenavComponentModule } from '@myName/card-component'

自动完成确实出现了，但它未能导入正确的元素.

The autocompletion did show up, but it then failed to import the correct element.

推荐答案

需要从库中导出组件、模块、服务等.
my-lib.ts

You need to export the components, modules, services, etc from the library.
my-lib.ts

   // Public API Surface
    export * from './lib/my-lib.service';
    export * from './lib/my-lib.component';
    export * from './lib/my-lib.module';

    // AllowedNonPeerDependencies
    export { SidenavComponentModule } from '@myName/card-component'

这篇关于如何让 vsCode 意识到自动完成的深度依赖导入?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！