javascript - วิธีหาสาเหตุของ "ไม่พบโมดูล" สำหรับโมดูล nrwl?

ฉันใช้ 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' ถูกลงทะเบียนอย่างถูกต้องหรือไม่?

ป.ล. ฉันสามารถเห็นโมดูล "models" ใน nx.json, angular.json และ tsconfig.json และฉันไม่เห็นความแตกต่างใด ๆ กับโมดูลอื่น ๆ

ป.ล.ล. ฉันใช้ "@nrwl/nx": "6.1.0" และ "@nrwl/schematics": "6.1.0"

คำตอบ #1

ในกรณีของฉันเป็นเพราะฉันโง่และไม่ได้เริ่มเซิร์ฟเวอร์ TypeScript ของฉันใหม่ใน VS Code:

CMD / CTRL + SHIFT + P
>TypeScript: Restart TS Server

คำตอบ #2

ฉันก็มีปัญหาเดียวกัน สร้างไลบรารีและลองใช้งานในหลายโปรเจกต์ ก่อนอื่นตรวจสอบให้แน่ใจว่าไลบรารีของคุณถูกเพิ่มใน tsconfig.json หลัก -> คุณสมบัติ paths

"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 ของแอปนั้นอย่างชัดเจนซึ่งคุณจะใช้ไลบรารี คีย์คือการลบคุณสมบัติ paths ออก เพราะคุณได้เพิ่มมันไปแล้วใน tsconfig.json หลัก (ในกรณีของฉันฉันใช้ nrwl (เทคนิคสำหรับการจัดการหลายแอป))

ตอนนี้คุณควรจะสามารถอ้างอิงโปรเจกต์ไลบรารีของคุณใด ๆ ได้ดังนี้:

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 {}

ไฟล์ index.ts สำหรับไลบรารี UI

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

เพิ่มการอ้างอิงโมดูล UI ในไฟล์ app.module.ts ของโปรเจกต์ของคุณ

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

ในการนำเข้าก็เช่นกัน

 imports: [
BrowserModule,
FormsModule,
ReactiveFormsModule,
HttpClientModule,
NgxPaginationModule,
Ng2OrderModule,
Ng2SearchPipeModule,
AngularEditorModule,
RichTextEditorAllModule,
NgxPrintModule,
DevExpressModule,
UiModule
...
],