How to use type definitions in non typescript files using VSCode

Question

I have a non ts code like this:

// foo.js

module.exports = app => {
  // some logic here
}

I want to use typescript definition files to define the type of the argument app, so that VSCode will give me the intelisense

// foo.d.ts
interface App {
  name: string
  bar: number
}

then I do jsdocs in my js file:

// foo.js - updated
/// <reference path="./foo.d.ts" />
/**
 * @param {App} app
 */
module.exports = (app) => {

}

when I write app. it shows me the available properties.

But if I change my definition file so that it has dependencies:

import * as React from "react"

export interface App {
    name: string
    count: number
}

intelisense stops working.

What am I doing wrong?

Amid · Accepted Answer · 2017-06-09 12:03:25Z

2

Your foo.js is a module so your declaration file should describe it as a module as well. By adding import at the top of foo.d.ts file you are declaring a module - so far so good.

To consume your foo module you will have to use import keyword, for example (assuming the code below is in the file that is located in the same dir as foo.d.ts):

import {App} from './foo';

/**
 * @param {App} app
 */
module.exports = (app) => 
{
    console.log(app.count); //VSCode intellisence suggests name and count properties here
}

edited Jun 9, 2017 at 12:03

answered Jun 9, 2017 at 8:39

Amid

22.5k6 gold badges63 silver badges59 bronze badges

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

14 Comments

notgiorgi Over a year ago

The code I'm writing is not typescript, so I cannot do let c: foo.App I just want to use typescript definitions for VSCode intelisense

Amid Over a year ago

This does not make any difference. You are declaring a module - therefore you must import it in order to use even in js. You can omit the typescript specifics here. The main point is that you must use import keyword.

notgiorgi Over a year ago

How does importing ts definition file into js make sense?

Amid Over a year ago

You are not importing typescript definitions. You are importing javascript module - check the js syntax here: developer.mozilla.org/en/docs/Web/JavaScript/Reference/…. Definitions is there just for typing information and never being 'imported'.

notgiorgi Over a year ago

You might have misunderstood my question. I have two files, one is typescript type definitions for my app and another is code for my app. I want to use this type definitions only for intelisense, I just want VSCode to understand what type of variable I'm working with using jsdocs.

|

Collectives™ on Stack Overflow

How to use type definitions in non typescript files using VSCode

1 Answer 1

14 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

14 Comments

Your Answer

Sign up or log in

Post as a guest

Related