¿Cómo solicito el módulo jquery AMD para mi módulo TypeScript? Por ejemplo, digamos estructura de directorios para las escrituras se ve así:Cómo solicitar jquery a través de AMD en TypeScript

 

    jquery-1.8.2.js 
    jquery.d.ts 
    module.ts 
    require.js

quiero que el archivo generado a partir de JS module.ts para requerir jquery-1.8.2.js ser cargado a través de require.js.

Actualmente tengo:

 

    import jquery = module('jquery')

Esto se traduce en El nombre de "jQuery" no existe en el ámbito actual.

Fuente

2012-10-06 Mizzle-Mo

Primero obtenga el (require-jquery) del repositorio oficial de github. Después de esto su directorio se verá así:

require-jquery.js 
jquery.d.ts 
main.ts 
main.js 
test.html

Actualmente la forma más fácil de trabajar con módulos de jQuery y AMD en texto mecanografiado es escribir lo siguiente en los main.ts:

///<reference path="jquery.d.ts" /> 
declare var require; 
require(["jquery"], function($:JQueryStatic) { 
    $('body').append('<b>Hello JQuery AMD!</b>'); 
});

Y llamaremos a partir de su test.html:

<!DOCTYPE html> 
<html> 
    <head> 
     <script data-main="main" src="require-jquery.js"></script> 
    </head> 
    <body> 
     <h1>TypeScript JQuery AMD test</h1> 
    </body> 
</html>

Espero que esto ayude!

Fuente

2012-10-06 21:40:13

Esto no es para Main.ts o Main.js. Necesito un módulo (module.ts) para requerir y cargar jquery y todavía tenga Module.ts visto por Typescript como un módulo separado. Su solución parece que funcionaría para mi punto de entrada, pero necesito requerir jquery en módulos que no son el punto de entrada. –

Puede aplicar la misma lógica al resto de jquery-require-sample en la página de github: https://github.com/jrburke/require-jquery/tree/master/jquery-require-sample Simplemente cambie el requerimiento declaración y está listo para ir –

@Murat - Se supone que Typescript debe ser capaz de generar las declaraciones requeridas para usted con instrucciones de módulo. Me siento sucio haciendo esto :) –

Tome las jquery.d.ts básicas de la fuente TS (TypeScriptFile)
Mover los() declaraciones de la JQueryStatic en un módulo de la siguiente manera:
en su importación módulo de código del jQuery:

import $ = module("jquery"); 

declare module "jquery" { 
    export function (selector: string, context?: any): JQuery; 
    export function (element: Element): JQuery; 
    export function (object: { }): JQuery; 
    export function (elementArray: Element[]): JQuery; 
    export function (object: JQuery): JQuery; 
    export function (func: Function): JQuery; 
    export function(): JQuery; 
}

compilar el módulo como AMD (AMD TSC --module MY_ code.ts)
Use RequireJS para componer su aplicación en el lado del cliente con la sección de configuración siguiente:

requirejs.config({ 
    paths: { 
     'jquery': 'js/jquery-1.8.2.min' 
    } 
});

Fuente

2012-10-09 14:59:38 IgorM

Al menos esto funciona. Con suerte, podemos actualizar el archivo jquery.d.ts en https://github.com/Diullei/tsd para que coincida. –

Hace referencia a los módulos externos de ruta y el nombre (menos la extensión .js) o simplemente por nombre de archivo si son globales. En su caso, usted debe hacer esto dentro de module.ts:

import jquery = module('./jquery-1.8.2');

Recuerde a compilar con --module AMD ya que por defecto que obtendrá el código que utiliza las CommonJS require de función.

Fuente

2012-11-01 00:37:04 nxn

No creo que esto funcione, porque jquery.d.ts no declara un módulo jquery externo: 'declare module" jquery "{}'. Solo declara que las variables globales –

Creo que gran parte de la confusión se debe a que jQuery no actúa realmente como un módulo externo, lo que inhibe el uso de una declaración import. La solución es bastante limpia, simple y elegante para no tener ganas de trabajar.

He escrito un ejemplo sencillo de Using RequireJS and jQuery in TypeScript, que funciona de la siguiente manera ...

que agarrar las definiciones de tipo de Definitely Typed para RequireJS y jQuery.

Ahora puede usar RequireJS sin procesar con mecanografía estática dentro del archivo de TypeScript.

app.ts

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

require(['jquery'], function ($) { 
    $(document).ready(() => { 
     alert('Your code executes after jQuery has been loaded.'); 
    }); 
});

y luego sólo tiene que añadir la etiqueta script sola a su página:

<script data-main="app" src="require.js"></script>

Beneficios sobre otras soluciones?

Puede actualizar jQuery y RequireJS independientemente
Usted no tiene que depender de proyecto de cuña que se actualiza
Usted no tiene que cargar manualmente jQuery (o cualquier otra cosa que no es "como un módulo" que tiene un archivo de .d.ts)

Fuente

2013-01-26 13:44:08 Fenton

requieren que js falte en el repositorio. No puedo encontrar – atilkan

@emrah Está aquí: https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/requirejs/require.d.ts – Fenton

pARA mecanografiado 1.7+

parece norma está cambiando de nuevo, en el que el método siguiente 0.9+ todavía funciona, pero con la llegada de ES6, podría usarse la siguiente carga de módulo. (Referencia: https://github.com/TypeStrong/atom-typescript/issues/237#issuecomment-90372105)

import * as $ from "jquery";

e incluso parciales

import {extend} from "jquery";

(esto todavía requiere los jquery.d.ts, si se instala TSD - tsd install jquery)

para instalar TSD: npm install tsd -g

PARA TYPESCRIPT 0.9+

/// <reference path="../../typings/jquery/jquery.d.ts" /> 
import $ = require('jquery'); 

//Do your stuff

Y también, si sus jquery.d.ts no definen un módulo externo, añada lo siguiente a jquery.d.ts:

declare module "jquery" { 
    export = $; 
}

Fuente

2013-09-01 20:04:48

Si lo intento, obtengo errores: no se puede resolver el módulo externo '' jquery '' . y el Módulo no se puede aliasar a un tipo que no sea de módulo. – ghost23

Parece que no tiene el módulo de declaración "jquery" en jquery.d.ts. –

Encontré el problema, era algo completamente diferente: mi biblioteca jquery se llama "jquery-1.9.1" * facepalm * – ghost23

Cómo solicitar jquery a través de AMD en TypeScript

Respuesta

pARA mecanografiado 1.7+

PARA TYPESCRIPT 0.9+

Cuestiones relacionadas