puede - import javascript
Nueva sintaxis es6 para importar módulos commonjs/amd, es decir, `import foo=require(''foo'')` (6)
Anteriormente pude hacer:
import foo = require(''foo'');
Pero ahora que TypeScript (1.5) admite la sintaxis del módulo es6, cuál es la forma correcta de lograr lo mismo en la sintaxis del módulo ES6.
Los módulos ES6 son efectivamente módulos externos TypeScript con una nueva sintaxis: los módulos ES6 son archivos fuente cargados por separado que posiblemente importen otros módulos y proporcionen una cantidad de exportaciones accesibles externamente. Los módulos ES6 presentan varias nuevas declaraciones de exportación e importación. Se recomienda que las bibliotecas y aplicaciones TypeScript se actualicen para usar la nueva sintaxis, pero esto no es un requisito.
Según tengo entendido, eso significa que se le recomienda migrar sus propios módulos TypeScript a la nueva sintaxis, pero siga utilizando
import foo = require(''foo'')
para importar módulos AMD / CommonJS reales.
A partir de
TypeScript 2.7
, hay un nuevo indicador
esModuleInterop
que se puede utilizar para habilitar las importaciones predeterminadas con CommonJS / AMD / UMD.
Al establecer ese indicador en
true
en su
tsconfig.json
, esto debería funcionar como se espera:
import foo from ''foo'';
La forma correcta es continuar usando la sintaxis de importación anterior.
La nueva sintaxis de importación es solo para módulos ES, la sintaxis de importación anterior es para módulos anteriores a ES6.
Los dos son distintos, intencionalmente.
import * as foo from ''foo''
importa todas las
propiedades
del módulo ''foo'',
no importa el valor predeterminado como
foo
.
-
Una declaración predeterminada de exportación siempre declara un miembro exportado llamado predeterminado y siempre se emite como una asignación a exportaciones.default.
En otras palabras,
export default
consistentemente tiene una semántica del módulo ES. Para compatibilidad con Babel, opcionalmente podríamos emitir un marcador__esModule
cuando un módulo tiene una exportación predeterminada, pero en realidad no__esModule
ese marcador para nada. -
Una declaración
export =
, que sustituye a una entidad diferente para ser exportada en lugar del módulo en sí, siempre se emite como una asignación amodule.exports
. Es un error tener otras exportaciones en un módulo que usaexport =
. Este es el comportamiento existente de TypeScript. -
Un módulo que usa
export =
para exportar otro módulo (ya sea un módulo interno o externo) puede importarse usando las nuevas construcciones ES6. En particular, las convenientes importaciones de desestructuración pueden usarse con tales módulos. El patrón de usarexport =
para exportar otro módulo es común en los archivos .d.ts que proporcionan una vista CommonJS / AMD de un módulo interno (por ejemplo, angular.d.ts). -
Un módulo que usa
export =
para exportar una entidad que no es un módulo en lugar del módulo en sí debe importarse utilizando la sintaxis existenteimport x = require("foo")
como es el caso hoy.
Actualización de 2016:
el compilador TypeScript en algún momento comenzó a permitir la
import * as foo from ''legacy-module-foo''
para obtener la importación predeterminada de un módulo heredado en ciertas circunstancias.
Esto es una violación de la especificación ES6
(
§15.2.1.16
,
"El valor" * "indica que la solicitud de importación es para el objeto de
espacio
de
nombres
del módulo de destino."
).
Cuando los módulos heredados que importe de esta manera se actualicen a los módulos ES6, las importaciones "predeterminadas" para esos módulos dejarán de funcionar (porque
* as foo
se
supone
que las importaciones importan
objetos de espacio de nombres
), lo que puede ser extremadamente confuso si no lo hace. sepa que hacer esto es un hack de TypeScript / SystemJS.
También es posible que una futura realineación de TypeScript a la especificación ES haga que se rompan.
Como tal, probablemente debería preferir continuar utilizando la sintaxis de importación heredada descrita anteriormente para cargar módulos heredados para evitar confundirse a usted mismo y a otros desarrolladores que trabajan en su código sobre cómo funcionan las importaciones de espacio de nombres ES6, y para evitar cambios confusos.
La sintaxis correspondiente para la sintaxis del módulo ES6 es:
import * as foo from ''foo'';
Básicamente, importe todo desde el módulo
foo
a una variable local con el nombre de
foo
.
Otra opción es importarlo usando la sintaxis commonjs:
const foo = require("foo");
TypeScript y Bable están de acuerdo sobre qué hacer con esto. Además, si está compilando a ES5 o menos de todos modos, entonces esto no estará muy lejos de su forma final.
para importar todo
const foo = require("foo");
esto importará todas las instancias del paquete "foo" si es un archivo, entonces
const foo = require("./foo");
para que pueda acceder a cada instancia llamando a
foo.InstanceName
si quieres importar una instancia específica,
import MyInstance from "foo";
así que esto importará una instancia específica (Myinstance) de "foo", todavía puede importar todo utilizando el método anterior,
import * as ReferenceName from "foo";
es equivalente a
const ReferenceName = require("foo");