VS Code: enable javascript intellisense in typescript project

Question

Is there a way to enable intellisense for Javascript files in a Typescript project? If I import a function from a javascript package like this:

import foo from "js-package"

and I'm in index.js, I see the intellisense picking up JsDoc comments and listing the parameters taken by the function; if I'm in a .ts file however, I don't get any of this. How do I enable Js intellisense in .ts files, using VS Code?

EDIT: This is what happens:

Ironic, isn't it?

Jammie

Have you tried AllowJS option in tsconfig.json ? – Seema

Try to add // @ts-check to the first line of the js-file. It might do what you want. – Skied

do you have typings or does the package have typing for typescript? If the package doesn't, typings need to be included in @types/... or in tsconfig. (github.com/microsoft/vscode/issues/24956).(https://github.com/… – Gazelle

Answer 1

You do not need any plugins. Just enable typeAcquisition in your tsconfig.json by adding:

{
    ...
    "typeAcquisition": {
            "enable": true
    }
}

This enables automatic detection and downloading of definition files for typescript. I often reload the window (restart vscode) when I change the settings, to make sure the settings have been read. This is not always necessary though.

This feature is disabled by default if using a tsconfig.json configuration file, but may be set to enabled as outlined further below). source

It was previously under typingOptions.enableAutoDiscovery, but was refactored to typeAcquisition.enable, as shown on this Github issue. You may still find references to on this websites. I find it harder to find information on typeAcquisition, but the schema proves its existence.

Missing tsconfig.json? Create one following the top answer here.

Tenishatenn

This seems to have actually fixed it. I'm now seeing jsdoc type info instead of just the "import module" thing. – Gurgle

Answer 2

I don't know if this solves exactly the asked problem but I was having some issues with IntelliSense in my TypeScript project (Vue 3, Vite and TypeScript). I received a warning saying "Partial mode - Project wide IntelliSense not available" and a link to this info page: https://code.visualstudio.com/docs/nodejs/working-with-javascript#_partial-intellisense-mode

After some research I found that I was using the next option in my settings:

"typescript.tsserver.useSyntaxServer": "always",

That option uses a lighter server to handle IntelliSense, but only for opened files. If you have this line, you can remove it to have "Project Wide IntelliSense" again.

¿Could you share your tsconfig.json and VSCode settings?

Let me know if I should open a separate question for this or remove it. I think it could be useful.

Propagable

My VSCode on M1 Mac had same "partial mode" problems for weeks. I searched answers in vain. And finally got and answer from Bing Chat and my question was Why is VSCode running in "typescript intellisense partial mode" And the solution was ` "typescript.tsserver.useSyntaxServer": "auto",` and it references this page. Thanks @Propagable – Yclept

Answer 3

Perhaps you have option "typescript.suggest.completeJSDocs": false. In this case, turning it to true could help you.

https://code.visualstudio.com/docs/languages/typescript#_jsdoc-support

Keep in mind that when using JSDoc for TypeScript code, you should not include type annotations. The TypeScript compiler only uses TypeScript type annotations and ignores those from JSDoc.

Entablement

Same issue, still shows the import module on hover. :( – Gurgle

Answer 4

I have this issue with a npm module, which doesn't have type definitions from definitely typed.

Just now I figured out, that if you add a reference to the .js file in your .ts file you get intellisense for the referenced file.

My top of the file looks like this:

///<reference path="../node_modules/tinkerforge/Tinkerforge.js" />
///<reference path="../node_modules/tinkerforge/lib/IPConnection.js" />

import * as tinkerforge from "tinkerforge";

let ip = new tinkerforge.IPConnection();
ip.connect();

It seems like a hack to me, but it does what I want it to do without the hassle of writing d.ts files for this module.

Can anybody else try this and confirm that it works?

Downswing

Answer 5

add following code in jsconfig.json file

"vueCompilerOptions": {
    "experimentalDisableTemplateSupport": true
},

here is a screenshot:

Tenuto

Answer 6

In hope that it will help someone, an answer on this thread suggested to adjust the "typescript.tsserver.useSyntaxServer" to "always".

(For me,) moving it to "always" caused the problem, and made vscode to prompt:

Partial mode - Project wide IntelliSense not available

If you have encountered problems with intellisese try to move the settings to "auto" instead:

"typescript.tsserver.useSyntaxServer": "auto"

Or you can do it in the GUI settings as well After adjusting this, this should stop and intellisense recovered, good luck!

Quarterdeck

Answer 7

You no need to initialize the intellisense for typescript it will detect automatically if you want to do explicitly you can check the below image you can select the language from there

Avilla

Look at my edited question: I said I can't have javascript intellisense in .ts files. I can't forcibly specify javascript as a language for intellisense in a .ts file... – Jammie

It will be detect automatically, you don't need to do any thing for JAVASCRIPT in .ts file – Avilla

As you can see from my images it is NOT detected! – Jammie

Answer 8

You might want to enable checkJs in the compiler options. The checkJs options let TypeScript compiler to check types on JavaScript code based on basic type inference and JSDoc.

The other way is delcaring modules by your own: TypeScript has a nice documentation about it.

Oneida

Answer 9

Have you tried "IntelliCode" extension?

Please find the link here: https://marketplace.visualstudio.com/items?itemName=VisualStudioExptTeam.vscodeintellicode

Macrae

Please don't just post some tool or library as an answer. At least demonstrate how it solves the problem in the answer itself. – Sharpeared

There is not much to describe, it adds intellisense to Visual Studio Code. I had the same problem and this extension helps while I have to work on Angular projects. But you are right, I forgot to add the plugin description as in the recommendations. – Macrae