How to import JQuery into a Typescript file?

You have to import it as import * as $ from "jquery";, according to typescript's documentation, and jquery's definition file the module is defined as an ambient module:

declare module "jquery" {
    export = $;
}

According to this:

Ambient declarations is a promise that you are making with the compiler. If these do not exist at runtime and you try to use them, things will break without warning.

An import is not required. Instead, add a reference to the Typescript definition file the top of the file. So the first line of the WebAPI.js should be

/// <reference path ="../typings/jquery/jquery.d.ts"/> 

instead of

import { $ } from '../jquery-3.1.1';

According to the DefinitelyTyped wiki:

A TypeScript declaration file is way of defining the types, functions and parameters in an external third-party JavaScript library. By using a declaration file in your TypeScript code will enable Intellisense and type checking against the external library you are using.

jquery.d.ts is a part of the DefinitelyTyped Library found on GitHub. Definitely Typed can be include in Visual Studio projects via the NuGet Package Manager.

do this : after installing jquery with npm or used with cdn

first:

npm install @types/jquery --save-dev

and after:

import * as $ from 'jquery';