TypeScript => Importazione di librerie esterne

Sintassi

import {component} from 'libName'; // Will import the class "component"
import {component as c} from 'libName'; // Will import the class "component" into a "c" object
import component from 'libname'; // Will import the default export from libName
import * as lib from 'libName'; // Will import everything from libName into a "lib" object
import lib = require('libName'); // Will import everything from libName into a "lib" object
const lib: any = require('libName'); // Will import everything from libName into a "lib" object
import 'libName'; // Will import libName module for its side effects only

Osservazioni

Potrebbe sembrare che la sintassi

import * as lib from 'libName';

import lib = require('libName');

sono la stessa cosa, ma non lo sono!

Consideriamo che vogliamo importare una classe Persona esportata con la sintassi export = specifica per TypeScript:

class Person {
...
}
export = Person;

In questo caso non è possibile importarlo con la sintassi es6 (otterremmo un errore in fase di compilazione), deve essere utilizzata la sintassi import = specifica di TypeScript.

import * as Person from 'Person';  //compile error
import Person = require('Person');  //OK

Il contrario è vero: i moduli classici possono essere importati con la seconda sintassi, quindi, in un certo senso, l'ultima sintassi è più potente poiché è in grado di importare tutte le esportazioni.

Per maggiori informazioni consultare la documentazione ufficiale .

Importare un modulo da npm

Se si dispone di un file di definizione del tipo (d.ts) per il modulo, è possibile utilizzare una dichiarazione di import .

import _ = require('lodash');

Se non si dispone di un file di definizione per il modulo, TypeScript genera un errore nella compilazione perché non riesce a trovare il modulo che si sta tentando di importare.

In questo caso, è possibile importare il modulo con la normale funzione di require runtime. Questo lo restituisce come any tipo, comunque.

// The _ variable is of type any, so TypeScript will not perform any type checking.
const _: any = require('lodash');

A partire da TypeScript 2.0, è anche possibile utilizzare una dichiarazione del modulo ambiente abbreviata per indicare a TypeScript che un modulo esiste quando non si dispone di un file di definizione del tipo per il modulo. Tuttavia, in questo caso, TypeScript non sarà in grado di fornire alcun typechecking significativo.

declare module "lodash";

// you can now import from lodash in any way you wish:
import { flatten } from "lodash";
import * as _ from "lodash";

A partire da TypeScript 2.1, le regole sono state ulteriormente rilassate. Ora, finché nella tua directory node_modules esiste un modulo, TypeScript ti consentirà di importarlo, anche senza la dichiarazione del modulo da nessuna parte. (Si noti che se si utilizza l'opzione del compilatore --noImplicitAny , sotto verrà comunque generato un avviso).

// Will work if `node_modules/someModule/index.js` exists, or if `node_modules/someModule/package.json` has a valid "main" entry point
import { foo } from "someModule";

Trovare i file di definizione

per dattiloscritto 2.x:

le definizioni di DefinitelyTyped sono disponibili tramite il pacchetto @types npm

npm i --save lodash
npm i --save-dev @types/lodash

ma nel caso in cui tu voglia usare tipi da altri repository, allora possono essere usati in un modo vecchio:

per typescript 1.x:

Typings è un pacchetto npm in grado di installare automaticamente i file di definizione del tipo in un progetto locale. Ti raccomando di leggere il quickstart .

npm install -global typings

Ora abbiamo accesso alle tipizzazioni cli.

Il primo passo è cercare il pacchetto utilizzato dal progetto

typings search lodash
NAME              SOURCE HOMEPAGE                                        DESCRIPTION VERSIONS UPDATED
lodash            dt     http://lodash.com/                                          2        2016-07-20T00:13:09.000Z
lodash            global                                                             1        2016-07-01T20:51:07.000Z
lodash            npm    https://www.npmjs.com/package/lodash                        1        2016-07-01T20:51:07.000Z

Quindi decidi da quale fonte dovresti installare. Io uso dt che sta per DefinitelyTyped un repository GitHub in cui la community può modificare i tipi di tipizzazione, è anche normalmente l'ultimo aggiornato.

Installa i file di battitura

 typings install dt~lodash --global --save

Analizziamo l'ultimo comando. Stiamo installando la versione DefinitelyTyped di lodash come file di tipizzazione globale nel nostro progetto e salvandola come dipendenza da typings.json . Ora dovunque importiamo lodash, dattiloscritto carica il file di tipizzazione di lodash.

Se vogliamo installare i tipi che verranno utilizzati solo per l'ambiente di sviluppo, possiamo fornire il --save-dev :
```
 typings install chai --save-dev
```

Utilizzo di librerie esterne globali senza digitazioni

Sebbene i moduli siano ideali, se la libreria che si sta utilizzando è referenziata da una variabile globale (come $ o _), poiché è stata caricata da un tag script , è possibile creare una dichiarazione ambientale per fare riferimento ad essa:

declare const _: any;

Ricerca di file di definizione con typescript 2.x

Con le versioni 2.x del dattiloscritto, le digitazioni sono ora disponibili dal repository @times npm . Questi sono automaticamente risolti dal compilatore dattiloscritto e sono molto più semplici da usare.

Per installare una definizione di tipo, devi semplicemente installarla come dipendenza dev nei tuoi progetti package.json

per esempio

npm i -S lodash
npm i -D @types/lodash

dopo l'installazione si usa semplicemente il modulo come prima

import * as _ from 'lodash'

Modified text is an extract of the original Stack Overflow Documentation

Autorizzato sotto CC BY-SA 3.0

Non affiliato con Stack Overflow

TypeScript
Importazione di librerie esterne

Ricerca…