Cannot import angular module in VSCode

Question

I tried to import NgForm in angular with the following import

import { NgForm } from '@angular/forms/src/directives/ng_form';

It searches for node modules folder in src/app which is why it returns an error. The node modules folder is 2 levels up from the app folder.

However when I try the following path

import { NgForm } from '@angular/forms';

It works no problem. Why is this? I use vscode, so the first path is the default way that VScode auto-imported NgForm.

It is a TypeScript issue It is still happening in v2.6.2 but it looks like we shouldn't have to wait long for this to get fixed. github.com/Microsoft/TypeScript/pull/20049 — JayChase
– JayChase, Commented Dec 20, 2017 at 3:42

Sajeetharan · Accepted Answer · 2017-12-20 02:09:17Z

1

It is due to Angular v4 no longer support deep imports like this.

import { NgForm } from '@angular/forms/src/directives/ng_form';

answered Dec 20, 2017 at 2:09

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Do you know how I can auto-import the correct way in VScode editor?

it will show a bulb icon in yello when you hove over NgForm. you can click that

did that help you?

I do not any see lightbulb when I do that. I want the auto import to not do a deep import. Just do @angular/core

Sorry I installed all of those packages and it is still same.