1

我有一个项目my-components和一个项目my-showcase。my-components是一个 Angular 库，而my-showcase是一个 Angular 应用程序。有时，当我在库中更改或添加组件时，我会提交到私有 git 并发布到私有 npm。然后我可以在my-showcase等其他应用程序中使用它。在提交和发布之前，我会对其进行测试。到目前为止，我在 my-showcase 中创建和开发了一个新组件。完成后，我将其放入my-components。

有时我通过 npm 导入我的角度组件库：

import {TimePickerModule} from '@company/components';

对于测试和开发，我将其更改为本地路径：

import {TimePickerModule} from '../../../../company-components/projects/components/src';

不幸的是，我收到以下错误消息：

WARNING in ../company-components/node_modules/@angular/core/fesm5/core.js 15153:15-36
Critical dependency: the request of a dependency is an expression

和：

core.js:12584 ERROR Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[DcStickyBitsDirective -> ElementRef]:
  StaticInjectorError(Platform: core)[DcStickyBitsDirective -> ElementRef]:
    NullInjectorError: No provider for ElementRef!

显然，app my-showcase中库中的组件使用了my-components中的错误 node_module 文件夹（特别是@angular/core），而不是my-showcase中的 node_module 文件夹。

在处理 Angular 库和 NPM 时，是否有人为我提供解决方案或我的理解有误？如果太难以理解，请告诉我。

4

1 回答 1

0

我有一个解决方法。我将以下内容添加到tsconfig.json：

"@company/components": [
    "../path/to/projects/components/src"
],

"@angular/*": [
    "node_modules/@angular/*"
]

但我觉得这个解决方案不是很干净。如果我理解正确，问题是 Webpack 从组件库中获取 Angular 的东西，而不是从展示项目中获取。使用此解决方法，它会覆盖错误的路径。

于 2018-11-19T16:19:03.570 回答