Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to set intellisense for Angular.Js and Javascript in Visual Studio Code without adding TypeScript file reference on every js file

I am new to VS Code and want to use it for the development of an AngularJs app. However, I am having the problem of adding a reference link on the top of all JS files.

like this.

 /// <reference path="path/to/typings/tsd.d.ts" />

is there an alternative to this?

like image 531
Vikas Bansal Avatar asked Aug 13 '16 08:08

Vikas Bansal


People also ask

How do I activate VS Code IntelliSense?

You can trigger IntelliSense in any editor window by typing Ctrl+Space or by typing a trigger character (such as the dot character (.) in JavaScript).

Does VS Code have IntelliSense?

You can trigger IntelliSense in any editor window by typing Ctrl+Space or by typing a trigger character such as the . (dot character).


2 Answers

By default, all JavaScript files opened in Visual Studio Code are treated as independent units. If you want to enable IntelliSense for the whole project remember to place the jsconfig.json file at the root of your project.

Below is a jsconfig.json file which defines the JavaScript target to be ES6 and excludes the node_modules folder.

{
  "compilerOptions": {
    "target": "ES6",
    "module": "commonjs",
    "allowSyntheticDefaultImports": true
  },
  "exclude": [
    "node_modules"
  ]
}

You can get IntelliSense for AngularJS library through the use of type definition .d.ts files from DefinitelyTyped repository. The typings are easily managed using Typings manager.

To install Typings manager execute npm install typings --global. This will install typings manager as your global npm module. Then you can install AngularJS Definitions using typings install dt~angular --global command. This will install and persist definitions from DefinitelyTyped repository as global definitions.

You can list available definitions using typings search angular.

Now you'll have IntelliSense available for all files in your project without the need of adding /// reference.

You can find more in the VS Code manual.

Hope this helps!

like image 109
Jakub Synowiec Avatar answered Oct 09 '22 05:10

Jakub Synowiec


This is what worked for me on Linux Ubuntu 16.04 x64

npm init

sudo npm install -g typings

sudo ln -s /usr/bin/nodejs /usr/bin/node

typings install dt~angular --save --global

touch jsconfig.json

UPDATE:

Just wanted to advice against building new applications in AngularJS any more.

Angular2 + angular-cli is MUCH easier & expandable.

Believe me, Learn Angular 2 and save yourself MUCH hassle

like image 39
Mohamed El-Saka Avatar answered Oct 09 '22 05:10

Mohamed El-Saka