Roly Roly - 1 month ago 5
TypeScript Question

TypeScript: unexpected import of jQuery

Why is the

$
in the program below resolved by the compiler, given that I'm not importing jQuery?

function f () {
$('#loadFiles').click() // ok
$$('#loadFiles').click() // error, can't find name '$$'
}


I'm running the compiler (v2.0.3) as follows:


  • tsc Test.ts
    , where
    Test.ts
    contains only the above text;

  • with no
    tsconfig.json
    or
    typings.json
    in the containing folder.



I get that this may be related to the idiom commonly used in libraries like jQuery, but note that I'm not importing jQuery (as far as I know). But for some reason the compiler accepts '$' without complaining.

Can anyone reproduce this behaviour, or suggest how I might inadvertently be picking up a definition of '$'?

Answer

[Answering my own question]

First, I ran

tsc --traceResolution Test.ts

where Test.ts contains only the code

export function f () {
   $('#loadFiles').click()   // ok
}

(adding 'export' to force modules), tsconfig.json is empty, and typings is not installed, shows the following on my Node installation:

======== Type reference directive 'jquery' was successfully resolved to '/home/rolyp/Repo/concurrent-objects/node_modules/@types/jquery/index.d.ts', primary: true. ========

Several other "type reference directives" are also resolved, correspondingly exactly to the @types packages I have installed. So the problem seems to be that installing an @types package makes certain definitions globally available, without having to import them.

This seems to be how things are currently, although it doesn't interact with Webpack, which doesn't know about these implicit uses of packages.