javascript - namespace - typescript libs
Importe el módulo de TypeScript usando solo la definición de ambiente para usar en amd (2)
Tengo un módulo que depende de Backbone
. Tengo una definición de backbone.d.ts
pero TypeScript no parece querer compilar mi módulo a menos que mi
import Backbone = module("backbone")
en realidad apunta a un módulo de red troncal válido en lugar de un archivo de definición. Estoy usando los módulos cargados de AMD y tengo un shim requirejs definido para la red troncal.
¿Hay una solución alternativa además de crear una definición de módulo de backbone.ts falso?
Actualización: un efecto secundario de la solución es que este código ya no funciona porque el módulo ya no existe. Es necesario que exista debido a la necesidad de shim. La única solución que conozco es tener dos archivos .d.ts. Una para el archivo que utiliza la red troncal como una importación que no incluye el bit de declare module
. La otra para usar una /// <reference
que incluya la línea de declare module
.
/// <reference path="../dep/backbone/backbone.d.ts" />
interface IApi {
version: number;
Events: Backbone.Events;
}
El lenguaje TypeScript ha cambiado un poco desde esta respuesta original.
Por ejemplo, para importar un módulo externo que uses require
(mi respuesta original tenía la palabra clave del module
):
Este es un caso de uso común para importar backbone: usar la información de tipo de Definitely Typed:
/// <reference path="scripts/typings/backbone/backbone.d.ts" />
import bb = require(''backbone'');
Dentro de la definición de tipo, el módulo de red troncal se declara para usted, que es lo que permite que la importación sea válida:
//... lots of code and then...
declare module "backbone" {
export = Backbone;
}
Así que la pregunta original podría resolverse usando ...
/// <reference path="scripts/typings/backbone/backbone.d.ts" />
import bb = require(''backbone'');
interface IApi {
version: number;
Events: bb.Events;
}
class Api implements IApi {
public version = 1;
public Events: bb.Events = null;
}
Para este ejemplo de código, esto es todo lo que se necesita, pero lo más frecuente es que desee que la biblioteca de la red troncal se cargue en el tiempo de ejecución ... puede usar el comentario de amd-dependency
(oficialmente experimental) para hacer que la llamada a la función define
generada incluya la columna vertebral.
/// <reference path="scripts/typings/backbone/backbone.d.ts" />
/// <amd-dependency path="backbone" />
import bb = require(''backbone'');
interface IApi {
version: number;
Events: bb.Events;
}
class Api implements IApi {
public version = 1;
public Events: bb.Events = null;
}
En realidad, hay otra forma de manejar amd en typescript :
Clona el repositorio de Github DefinitelyTyped . Contiene el
jquery.d.ts
,backbone.d.ts
y muchos otros archivos de definición.Enlace los archivos de definición a su archivo
myfile.ts
:
/// <reference path="DefinitelyTyped/requirejs/require.d.ts" />
/// <reference path="DefinitelyTyped/jquery/jquery.d.ts" />
Agregue una dependencia de amd a la biblioteca javascript:
/// <amd-dependency path="jquery"/>
Para usar
$
dentro de su archivomyfile.ts
que ahora puede llamar, requiera:
var $ = require("jquery");
Versión completa de myfile.ts
:
/// <reference path="DefinitelyTyped/requirejs/require.d.ts" />
/// <reference path="DefinitelyTyped/jquery/jquery.d.ts" />
/// <amd-dependency path="jquery"/>
var $ = require("jquery");
export function helloWorld() {
$("<div>Hello World</div").appendTo(document.body);
}
Si ejecuta tsc --module amd myfile.ts
obtendrá el siguiente código javascript:
define(["require", "exports", "jquery"], function(require, exports) {
var $ = require("jquery");
function helloWorld() {
$("<div>Hello World</div").appendTo(document.body);
}
exports.helloWorld = helloWorld;
});