javascript - integrar - ¿Cómo importar JQuery en un archivo Typescript?

types jquery

Question

Actualizar

No se requiere ninguna importación. En su lugar, necesitaba agregar una referencia a la parte superior del archivo. Así que la primera línea de mi WebAPI.js debería haber sido /// <reference path ="../typings/jquery/jquery.d.ts"/> lugar de import { $ } from ''../jquery-3.1.1'';

Estoy tratando de importar jQuery para usar en un archivo Typescript, pero recibo una variedad de errores con todo lo que intento. Seguí las soluciones here y here , pero sin suerte.

tsconfig.json

{
    "compilerOptions": {
        "removeComments": true,
        "preserveConstEnums": true,
    "out": "Scripts/CCSEQ.Library.js",
    "module": "amd",
        "sourceMap": true,
    "target": "es5",
    "allowJs": true
}

WebAPI.js

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

export class ExpenseTransaction extends APIBase {

    constructor() {
        super();
    }

    Get(): void {
        let expenses: Array<Model.ExpenseTransaction>;
        let self = this;
        $.ajax({
            url: this.Connection,
            type: "GET",
            contentType: "application/json",
            dataType: "json",
            success: function (data: any): void {
                expenses = self.ConvertToEntity(data.value);
            },
            error: function (data: any): void { console.log(data.status); }
        });
    };
}

También he intentado import * as $ from ''../jquery.3.1.1''

Los errores

• Module jquery-3.1.1 has no exported member $
• Property ajax does not exist on type (selector: any, context: any) => any

Answer 1

Intente reemplazar su importación con declare let $: cualquiera;

Answer 2

No se requiere una importación. En su lugar, agregue una referencia al archivo de definición de Typescript en la parte superior del archivo. Así que la primera línea del WebAPI.js debería ser

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

en lugar de

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

Según la wiki DefinitelyTyped :

Un archivo de declaración de TypeScript es una forma de definir los tipos, funciones y parámetros en una biblioteca externa de JavaScript de terceros. Al utilizar un archivo de declaración en su código TypeScript, se habilitará Intellisense y la comprobación de tipos en la biblioteca externa que está utilizando.

jquery.d.ts es una parte de la biblioteca DefinitelyTyped que se encuentra en GitHub. Definitivamente se puede escribir en proyectos de Visual Studio a través del Administrador de paquetes de NuGet.

Answer 3

Tienes que importarlo como import * as $ from "jquery"; Según la documentation de mecanografia y el archivo de definición de jquery, el módulo se define como un módulo de ambiente:

declare module "jquery" {
    export = $;
}

De acuerdo a this :

Las declaraciones ambientales son una promesa que está haciendo con el compilador. Si no existen en el tiempo de ejecución y usted intenta usarlas, las cosas se romperán sin previo aviso.

¡Espero eso ayude!

Answer 4

haga esto: después de instalar jquery con npm o usado con cdn

primero:

npm install @types/jquery --save-dev

y después:

importar * como $ desde ''jquery'';