10

我在我的项目中使用 nrwl.io。

我创建了几个库：

ng g lib rest //ok
ng g lib services //ok
ng g lib models //created ok, but "Cannot find module " later on!

所有这些库都已成功创建，但是当我尝试导入我的models库时，我看到错误“找不到模块”：

import { ModelA, ModelB } from '@myproj/models'; //Cannot find module '@myproj/models'

问题是：我如何以及在哪里可以检查我'@myproj/models'的注册是否正确？

PSnx.json我可以在和angular.json中看到“模型”模块tsconfig.json。而且我看不出与其他模块有什么区别。

我使用的PPS"@nrwl/nx": "6.1.0"和 "@nrwl/schematics": "6.1.0"

4

6 回答 6

12

就我而言，这是因为我很笨，没有在 VS Code 中重新启动我的 TypeScript 服务器：

CMD / CTRL + SHIFT + P
>TypeScript: Restart TS Server
于 2020-05-31T13:58:53.100 回答
10

我也有同样的问题。创建了一个库并尝试在多个项目中使用它。首先确保您的库已添加到主 tsconfig.json -> 路径属性中。

"paths": {
  "@projectName/LibraryName1": ["libs/LibraryName1/src/index.ts"],
  "@projectName/LibraryName2": ["libs/LibraryName2/src/index.ts"],
  ....
}

然后，您必须将项目添加到主 angular.json 文件中。

"projects": {
   "LibraryName1": {
   "root": "libs/LibraryName1",
   "sourceRoot": "libs/LibraryName1/src",
   "projectType": "library",
   "prefix": "projectName",
   "projectType": "library"
   ...
  }
}

然后显然检查 tsconfig.json 文件以查找您要在其中使用 lib 的应用程序。关键是删除路径属性。因为您已经在 main tsconfig.json 中添加了（在我的情况下，我使用了 nrwl（一种管理多个应用程序的技术））。

现在您应该能够像这样引用您的任何 lib 项目：

import { class1,class2 } from '@projectName/libraryName1';

不要忘记使用 index.ts 导出您的类（假设您有模型库），如下所示：

export * from './lib/class1';
export * from './lib/class2';

或者，如果您有任何具有组件的 UI 库。您应该创建一个模块，在其中添加这些组件，然后使用 index.ts 将其导出。模块文件应该在 lib 文件夹中。例如

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { NumberOnlyDirective } from './directives/number-only.directive';

@NgModule({
imports: [CommonModule],
declarations: [NumberOnlyDirective],
exports: [NumberOnlyDirective]
})
export class UiModule {}

UI 库的 index.ts 文件

export * from './lib/ui.module';

在您的项目 app.module.ts 中添加 UI 模块的引用

import { UiModule } from '@projectName/LibraryName1';

在进口也

 imports: [
BrowserModule,
FormsModule,
ReactiveFormsModule,
HttpClientModule,
NgxPaginationModule,
Ng2OrderModule,
Ng2SearchPipeModule,
AngularEditorModule,
RichTextEditorAllModule,
NgxPrintModule,
DevExpressModule,
UiModule
...
],
于 2019-11-01T11:29:33.023 回答
2

我也遇到了这个问题。

假设项目名为“project1”，库名为“libray1”（因此我们试图引用模块“@project1/library1”）。引用 NRWL NX 生成的库模块可以在非 Angular（在我的特定情况下为 Ionic/Angular）上下文中正常工作，但会导致 monorepo 中的 Angular 应用程序出现“找不到模块”错误。

出现问题的原因是 Angular 应用程序在“project1/libs/library1”位置查找桶文件 (index.ts)，而 NX 将桶放在“project1/libs/library1/src”中的下一级。

（有点烦人的）解决方案是在“project1/libs/library1”位置创建一个额外的 index.ts 文件，其中包含以下内容：

export * from './src';

这确保了代码在所有上下文中都有效，并且是一次修复的解决方案（对于您生成的每个新库），而不是必须添加对 repo 中每个 Angular 应用程序的 package.json 文件的显式引用。

于 2020-02-28T00:25:28.103 回答
1

我在尝试创建新库时遇到了同样的问题。我删除node_modules并重新安装它。修复了问题

于 2021-11-26T04:46:57.840 回答
0

当你使用@model/something 导入一些东西时，编辑器会自动添加一个完整的模块路径（在我的例子中）。所以这就是我必须做的让导入'@'工作。

  • 删除编辑器添加的全路径导入。只保留您正在输入的那个 - 即；使用@project/models。
  • 关闭服务器并再次服务。
于 2018-09-23T05:48:30.253 回答
-1

这是--parent-module=apps/myapp/src/app/app.module.ts创建库时使用的地方。

flag 所做的一件事是修改tsconfig.app.json并添加"../../libs/mylib/src/index.ts到包含告诉 TS 使用该模块。

于 2018-09-14T16:00:04.677 回答