VSCode AngularJS Intellisense not working - angularjs

Installed typings globally
npm install -g typings.
Installed AngularJS types
typings install dt~angular --save
jsconfig.jsong file is in the root of my angular project along with typings.json and typings folder containing the angular module typings. I restarted vscode, still nothing.
What else can I check?

For JS projects, typings should be acquired automatically. Take a look at our documentation on automatic type acquisition for more info.
If automatic type acquisition is not working for some reason, try using #types instead of using typings:
npm i --save-dev #types/angular
These typings files should be automatically picked up for intellisense in VSCode.
Then if you still don't see proper intellisense, please open an issue. Include your jsconfig.json and some example code.

Related

Depedency issues, cloned react project

I cloned a React/typescript package from GitHub, but cannot get it to work. When I do npm install, the compiler complains that my typescript version is too new:
WARNING: You are currently running a version of TypeScript which is not officially supported by #typescript-eslint/typescript-estree
Is there some way, I can use exactly the node and packages versions as listed in the package.json?
I've also tried npm install --legacy-pee-deps, but that wasn't fruitful either, still get the problem. Also, I tried setting npm config set save-exact true before installing packages.
Thanks!

Declaration file errors for npm packages in React

I'm using React—not with TypeScript—and I have successfully installed a few common npm packages (React and React Router, Draft.js (Facebook's rich text editor), Prism, bcrypt, etc.)
I'm trying to install two npm packages to use with Draft.js— draft-js-code and draft-js-prism—and I'm repeatedly getting this error:
Could not find a declaration file for module 'draft-js-prism'. >'/Users/username/beta/react/node_modules/draft-js-prism/lib/index.js' implicitly has an >'any' type.
Try npm install #types/draft-js-prism if it exists or add a new declaration (.d.ts) >file containing declare module 'draft-js-prism';ts(7016)
I've tried some basic stuff: uninstalling and reinstalling, installing typescript, npm rebuild... nothing. What's going on here? Again, I'm not using typescript and I've installed other npm packages in this project successfully. I've even installed other npm packages after these two that aren't causing errors.
Please help/pulling out my hair.

Module type definition relying on global one

I have installed reacttype definitions with the following command
typings install npm~react --save
So I have it in the folder
typings/modules/react
For react-dom there is only the global module available, that can be installed with the command
typings install dt~react-dom --save --global
And it goes in folder
typings/globals
Now React-Dom is unable to find react definitions because it expect to find it in the global folder.
What is the supposed way to deal with this scenario?
I honestly don't know the difference between global and module definitions... And the Typings readme is not explaining it.
I am starting using the npm definitions because they are more up to date.

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.
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:
I think you must restart VS Code to see the effects and have intellisense.
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.
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.
Your file structure is wrong:
tsconfig.json should be on the root directory of you app, i.e. AngularApp.
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.

typings.json not getting updated typings install --ambient

I used to work with tsd for managing my type definitions, but as it's deprecated, I'm trying to migrate to typings which is my opinion more complicated, but should be the way to go, I guess.
I want to install a type definition and for that I use the --ambient flag.
In Visual Studio I have the typings.json file which looks like that:
{
"name": "Test",
"version": false,
"ambientDependencies": {
"angular": "github:DefinitelyTyped/DefinitelyTyped/angularjs/angular.d.ts#ca92a5b250433c38230b5f4138b36453862342bf",
"jquery": "github:DefinitelyTyped/DefinitelyTyped/jquery/jquery.d.ts#ca92a5b250433c38230b5f4138b36453862342bf"
}
}
This was automatically created when migrating from tsd to typings but now once I need a new type definition, for instance angular-route I use the following command:
typings install angular-route --ambient
This works fine, but the typings.json does not get updated.
What is the point and why am I missing? Why were angular and jquery both migrated to typings.json and when installing angular-routethe file does not get refreshed?
Actually in Typings 1.0 they did some breaking changes.
"ambient" is now "global". Just in case, installing from DefinitelyTyped must be explicit.
The following will install jQuery and save it to typings.json
typings install dt~jquery --global --save
See the link in Igor's answer for more info
You forgot --save
typings install angular-route --ambient --save
command syntax above is now obsolete and only applicable to version 0.x
Link to Typings command help
Update
As pointed out by #AndresM there are breaking changes in going from version 0.x to 1.x. See the documentation Updating From 0.x to 1.0?. The command syntax in #AndresM answer is the correct way to execute a typings command using DefinitelyTyped store and Typings version 1.x.
Now with Typescript2.0(https://blogs.msdn.microsoft.com/typescript/2016/09/22/announcing-typescript-2-0/) the global is also gone. The following will install jQuery and angular typings:
npm install --save #types/angular #types/jquery
Your package.json will then have:
"dependencies": {
"#types/angular": "^1.5.16",
"#types/jquery": "^2.0.33"
}
Your node_modules directory will have #types/angular and #types/jquery directories which contain index.d.ts files.

Resources