TypeScript => Importer des bibliothèques externes

Syntaxe

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

Remarques

Il peut sembler que la syntaxe

import * as lib from 'libName';

import lib = require('libName');

sont la même chose, mais ils ne sont pas!

Considérons que nous voulons importer une classe Personne exportée avec export = syntax spécifique à TypeScript:

class Person {
...
}
export = Person;

Dans ce cas, il n'est pas possible de l'importer avec la syntaxe es6 (nous aurions une erreur à la compilation), vous devez utiliser la syntaxe import = spécifique à TypeScript.

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

L'inverse est vrai: les modules classiques peuvent être importés avec la deuxième syntaxe, de sorte que, d'une certaine manière, la dernière syntaxe est plus puissante puisqu'elle est capable d'importer toutes les exportations.

Pour plus d'informations, voir la documentation officielle .

Importer un module à partir de npm

Si vous avez un fichier de définition de type (d.ts) pour le module, vous pouvez utiliser une instruction d' import .

import _ = require('lodash');

Si vous ne disposez pas d'un fichier de définition pour le module, TypeScript générera une erreur lors de la compilation car il ne peut pas trouver le module que vous essayez d'importer.

Dans ce cas, vous pouvez importer le module avec la durée normale require fonction. Cela le retourne comme any type, cependant.

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

À partir de TypeScript 2.0, vous pouvez également utiliser une déclaration abrégée de module d'ambiance afin d'indiquer à TypeScript qu'un module existe lorsque vous n'avez pas de fichier de définition de type pour le module. TypeScript ne sera cependant pas en mesure de fournir une vérification de type significative dans ce cas.

declare module "lodash";

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

A partir de TypeScript 2.1, les règles ont été encore assouplies. Maintenant, tant qu'un module existe dans votre répertoire node_modules , TypeScript vous permettra de l'importer, même sans déclaration de module. (Notez que si vous utilisez l'option de compilation --noImplicitAny le --noImplicitAny ci-dessous générera toujours un avertissement.)

// 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";

Recherche de fichiers de définition

pour dactylographier 2.x:

les définitions de DefinitelyTyped sont disponibles via le package @types npm

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

mais dans le cas où vous souhaitez utiliser des types d'autres repos, vous pouvez utiliser l'ancienne méthode:

pour typecript 1.x:

Typings est un package npm qui peut installer automatiquement des fichiers de définition de type dans un projet local. Je vous recommande de lire le quickstart .

npm install -global typings

Maintenant, nous avons accès aux types de cli.

La première étape consiste à rechercher le package utilisé par le projet.

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

Ensuite, décidez de la source à installer. J'utilise dt qui signifie DefinitelyTyped un repo GitHub où la communauté peut éditer les typages, c'est aussi normalement le plus récemment mis à jour.

Installer les fichiers de saisie

 typings install dt~lodash --global --save

Décomposons la dernière commande. Nous installons la version DefinitelyTyped de lodash en tant que fichier de typage global dans notre projet et l'enregistrons en tant que dépendance dans le typings.json . Maintenant, où que nous importions lodash, typecript chargera le fichier typage lodash.

Si nous voulons installer des typages qui ne seront utilisés que pour l'environnement de développement, nous pouvons fournir le drapeau --save-dev :
```
 typings install chai --save-dev
```

Utiliser des bibliothèques externes globales sans typage

Bien que les modules soient idéaux, si la bibliothèque que vous utilisez est référencée par une variable globale (telle que $ ou _), car elle est chargée par une balise de script , vous pouvez créer une déclaration ambiante pour y faire référence:

declare const _: any;

Recherche de fichiers de définition avec les typescript 2.x

Avec les versions 2.x de typescript, les types sont maintenant disponibles dans le dépôt npm @types . Celles-ci sont automatiquement résolues par le compilateur typecript et sont beaucoup plus simples à utiliser.

Pour installer une définition de type, installez-la simplement en tant que dépendance de dev dans vos projets package.json

par exemple

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

après l'installation, vous utilisez simplement le module comme avant

import * as _ from 'lodash'

Modified text is an extract of the original Stack Overflow Documentation

Sous licence CC BY-SA 3.0

Non affilié à Stack Overflow

TypeScript
Importer des bibliothèques externes

Recherche…