TypeScript => Externe bibliotheken importeren

Syntaxis

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

Opmerkingen

Het lijkt erop dat de syntaxis

import * as lib from 'libName';

import lib = require('libName');

zijn hetzelfde, maar dat zijn ze niet!

Laten we overwegen dat we een klasse Persoon willen importeren die is geëxporteerd met TypeScript-specifieke export = syntaxis:

class Person {
...
}
export = Person;

In dit geval is het niet mogelijk om het te importeren met es6-syntaxis (we zouden een foutmelding krijgen tijdens het compileren), TypeScript-specifieke import = syntax moet worden gebruikt.

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

Het omgekeerde is waar: klassieke modules kunnen worden geïmporteerd met de tweede syntaxis, dus in zekere zin is de laatste syntaxis krachtiger omdat deze alle uitvoer kan importeren.

Zie de officiële documentatie voor meer informatie.

Een module importeren vanuit npm

Als u een typedefinitiebestand (d.ts) voor de module hebt, kunt u een import .

import _ = require('lodash');

Als u geen definitiebestand voor de module hebt, geeft TypeScript een foutmelding bij compilatie omdat het de module die u probeert te importeren niet kan vinden.

In dat geval kunt u de module te importeren met de normale runtime require functie. Dit retourneert het echter als een any type.

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

Vanaf TypeScript 2.0 kunt u ook een steno-omgevingsmodule-aangifte gebruiken om TypeScript te laten weten dat er een module bestaat wanneer u geen typedefinitiebestand voor de module hebt. TypeScript kan in dit geval echter geen zinvolle typecontrole bieden.

declare module "lodash";

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

Vanaf TypeScript 2.1 zijn de regels nog verder versoepeld. Zolang er een module in uw map node_modules , kunt u met TypeScript deze importeren, zelfs zonder ergens een node_modules . (Merk op dat als de compileroptie --noImplicitAny , de onderstaande nog steeds een waarschuwing zal genereren.)

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

Definitie van bestanden zoeken

voor typescript 2.x:

definities van DefinitelyTyped zijn beschikbaar via het pakket @types npm

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

maar in het geval dat je types uit andere repo's wilt gebruiken, kan deze op de oude manier worden gebruikt:

voor typescript 1.x:

Typings is een npm-pakket dat automatisch typedefinitiebestanden in een lokaal project kan installeren. Ik raad je aan de quickstart te lezen.

npm install -global typings

Nu hebben we toegang tot de typen cli.

De eerste stap is het zoeken naar het pakket dat door het project wordt gebruikt

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

Bepaal vervolgens vanuit welke bron u wilt installeren. Ik gebruik dt wat staat voor DefinitelyTyped een GitHub-repo waar de community typingen kan bewerken, het is normaal gesproken ook het meest recent bijgewerkt.

Installeer de typbestanden

 typings install dt~lodash --global --save

Laten we het laatste commando afbreken. We installeren de DefinitelyTyped-versie van lodash als een globaal typbestand in ons project en slaan deze op als een afhankelijkheid in de typings.json . Nu waar we lodash importeren, laadt typescript het lodash-typbestand.

Als we typen willen installeren die alleen voor de ontwikkelomgeving worden gebruikt, kunnen we de vlag --save-dev :
```
 typings install chai --save-dev
```

Wereldwijde externe bibliotheken gebruiken zonder te typen

Hoewel modules ideaal zijn, kunt u, als naar de bibliotheek die u gebruikt, wordt verwezen door een globale variabele (zoals $ of _), omdat deze is geladen door een script , een omgevingsdeclaratie maken om ernaar te verwijzen:

declare const _: any;

Definitiebestanden zoeken met typescript 2.x

Met de 2.x-versies van typescript zijn typings nu beschikbaar in de npm @types-repository . Deze worden automatisch opgelost door de typescript-compiler en zijn veel eenvoudiger te gebruiken.

Om een typedefinitie te installeren, installeert u deze eenvoudig als een dev-afhankelijkheid in uw projectenpakket.json

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

na installatie gebruikt u de module gewoon zoals eerder

import * as _ from 'lodash'

Modified text is an extract of the original Stack Overflow Documentation

Licentie onder CC BY-SA 3.0

Niet aangesloten bij Stack Overflow

TypeScript
Externe bibliotheken importeren

Zoeken…