Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular 10: Cannot find name when trying to import module

I created a new Angular project and a new module inside that project using the CLI. If I try to import the newly created module in app.module.ts the Intellisense doesn't work and it can't find the module to auto-import it. I didn't change anything inside the tsconfig.json files.

  • Angular CLI: 10.0.4
  • Node: 12.16.3
  • Angular: 10.0.5
  • Typescript: 3.9.7
  • VS Code: 1.47.3

Any idea what could cause it?

EDIT: A manual import works fine, but I'm asking about the auto-import functionality.

enter image description here

enter image description here

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';



@NgModule({
  declarations: [],
  imports: [
    CommonModule
  ]
})
export class TestModule { }
like image 379
Chris Avatar asked May 12 '26 16:05

Chris


1 Answers

I found the source of the problem in the tsconfig.json inside the project's root folder.

{
  "files": [],
  "references": [
    {
      "path": "./tsconfig.app.json"
    },
    {
      "path": "./tsconfig.spec.json"
    }
]
}

If you just change it to this

{
  "extends": "./tsconfig.base.json"
}

VS Code auto-import starts working

As I understand it the main problem is "files": [], typescript stops seeing all files that are not included in the project.

github.com/microsoft/TypeScript/issues/39632
https://github.com/angular/vscode-ng-language-service/issues/876
People offer the same solution

like image 106
Driver Avatar answered May 14 '26 06:05

Driver



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!