CODEWITHSUNDEEP
angularjstypescriptintellisensevisual-studio-code
reynaerta
reynaerta

Reputation: 45

VSCode Angular & typings: no intellisense

I try to set up a new project with angular 1.5.5 and I want to make use of typescript for my code. I use Visual Studio Code as my coding tool.
I added the typings for angular to my project: 

typings install angular --save --ambient

I added a typings.d.ts file and a tsconfig.json file but I don't have intellisense any of the .ts files I've added...

Don't know what am I doing wrong? Can someone help me? I try setup small project to reproduce the problem: download link

Great thx in advance!
Alexander.

Upvotes: 1

Views: 1606

Answers (4)

redeemefy
redeemefy

Reputation: 4849

I ran into some issues myself and here are the steps I took to make it work.

  • Open the terminal and run...
  • npm install typings -g
  • cd ~/root of your project
  • I had an error running typings install dt~angular --save --global
  • I install locally typings install dt~angular --save

Notice the typings folder in the root of your project. If you can't see the typings folder restart VS Code or cmd+shift+p and type reload and choose Reload Window.

In the root also is a typings.json file with the following object.

{
  "dependencies": {
    "angular": "registry:dt/angular#1.6.0+20170223151516"
  }
}

In the root of your project create an empty jsconfig.json

After creating the jsconfig.json file I Reload Window again. I opened the app.js file and got intellisense for angularjs.

enter image description here

Upvotes: 1

LeftyX
LeftyX

Reputation: 35587

I guess you must have seen an error when executing:

typings install angular --save --ambient

First of all you must install the new TypeScript Definition Manager:

npm install typings --global

then you must use this command in your project's folder:

typings install dt~angular --global --save

as explained in the quick start.

This command should create a file typings.json which should look something like this:

{
  "globalDependencies": {
    "angular": "registry:dt/angular#1.5.0+20160517064839"
  }
}

If you're wondering what that dt prefix is, you can run:

typings search --name angular

and you will see that dt represents the source:

enter image description here

I think you must restart VS Code to see the effects and have intellisense.

Upvotes: 1

Zen
Zen

Reputation: 5490

Your file structure is wrong:

  1. tsconfig.json should be on the root directory of you app, i.e. AngularApp.
  2. usually, typings.d.ts is there as well.

After you move these two files, remember to change the path inside them. Ts files must be included.

//tsconfig.json
{
//...
  "files":[  
    "typings.d.ts",
    "public/app/app.ts"
  ]
}

//typings.d.ts
/// <reference path="typings/browser.d.ts" />

If you want to download.

Upvotes: 0

jrossi
jrossi

Reputation: 196

One way to get intellisense is to add a ///<reference path="../typings.d.ts" /> to the top of your typescript files. As you add definitions, make sure to add them to the typings.d.ts file.

Upvotes: 0

Related Questions