Am 14. September 2017 haben wir eine überarbeitete Fassung unserer Datenschutzrichtlinie veröffentlicht. Wenn Sie video2brain.com weiterhin nutzen, erklären Sie sich mit diesem überarbeiteten Dokument einverstanden. Bitte lesen Sie es deshalb sorgfältig durch.

Angular 2 Grundkurs

Typdefinitionen installieren

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Innerhalb eines TypeScript-Projekts müssen gegebenenfalls Typdefinitionen nachgeladen werden. Die dafür nötige Vorgehensweise erläutert dieses Video.
06:54

Transkript

TypeScript ist in unserem Projekt nun konfiguriert und kann genutzt werden. Entscheidend ist, dass TypeScript ja typsicher arbeitet. Dabei könnt ihr erkennen, dass die meisten Module, die wir hier laden, und auch verwenden, immer solche dts-Dateien drin haben. Und diese dts-Dateien sind Typdefinitionen für TypeScript, in denen festgehalten wird, wie sich eine Klasse zusammensetzt, welche Methoden es hat, welche Typen es in diesen jeweiligen Elementen gibt. Wie die einzelnen Parameter typisiert sind und so weiter und so weiter. Es gibt aber Projekte, die sind nicht basiert auf TypeScript. So zum Beispiel das Projekt "core-js". Das CoreJS-Projekt ist ein reines Javascript-Projekt. Und dieses Javascript-Projekt ist ja ein Polyfill, und ist auf Basis, hier an dieser Stelle, von ECMAScript 5 definiert und hier haben wir dan einfach nur die jeweiligen Elemente dafür angegeben. Was wir also tun müssen ist, wenn wir das im TypeScript-Kontext verwenden wollen, ist es natürlich sehr wichtig, dass wir die Typdefinition für CoreJS nachliefern. Dafür haben wir uns in unserem Projekt Typings installiert. Typings ermöglicht es uns, fehlende Typdefinitionen ohne Probleme nachzuladen und zu installieren. Damit wir Typings verwenden können, werden wir gleich eine Typings-Konfiguration anlegen, und in dieser Konfiguration die anhängigen Typdefinitionen herunterladen. Damit ich Typings innerhalb des Node-Moduls verwenden kann, und von außen ansprechen kann, über "npm run", muss ich das hier im Skript angeben. Und zwar sage ich: Wenn außerhlb über "npm run" Typings angesprochen wird, soll das interne Typings-Modul entsprechend angesprochen werden. Und das Typings selber, das initialisiere ich jetzt, um dann anschließend eine Typings.json zu erzeugen. Und das mache ich innerhalb des Terminals. im Ordner "setup". Und dadurch, dass ich jetzt hier hingegangen bin und Typings angegeben habe, kann ich "npm run typings verwenden". Und wenn ich das jetzt hier aufrufe, dann sehen wir hier, dass wir in der Lage sind, Typings mit unterschiedlichen Befehlen aufzurufen. Einer dieser Befehle ist "init". Das heißt mit den zwei Bindestrichen sage ich dem Node-Packagemanager, dass er diese Option durchreichen soll an das Typingsmodul mit "init". Führe ich das aus, wird mir automatisch jetzt hier innerhalb meines Projektes eine typings.json entsprechend angelegt. Und diese typings.json, in diesem kann ich die Typdefiniton, die ich innerhalb meines Projekts brauche, hinterlegen. Vorteil ist es, dass ich dann späetr in der Lage bin, dieses Setup, das ich hier habe, einem Kollegen zu geben. Der muss dann nicht die jeweiligen Typdefinitionen per Hand installieren, wie wir es gleich tun werden, sondern macht lediglich ein "typings install" und alle Typen, die notwendig sind werden dann installiert und hinterlegt. Welche Typdefinition benötige ich eigentlich innerhalb meines Angular 2-Projektes? Als erstes installiere ich die Node-Typen. Damit möchte ich dann in der Lage sein, dass ich alle relevanten Typdefinitionen für die Node-Welt sicher habe. Das mache ich mit "npm run typings". Und ihr seht, es gab hier den Befehl "install". Den rufe ich hier auf, "install". Ich möchte die Typdefiniton haben und zwar von Node. Anschließend möchte ich, dass diese Information in meiner Typings.json gespeichert wird, als globale Information. Ich führe das einmal aus. Wunderbar. Ist geladen. Und hier sehen wir dann entsprechend, dass die Typdefinitionen heruntergeladen worden sind. Hierfür sehen wir zusätzlich, dass automatisch ein "typings"-Ordner angelegt worden ist. Und in dem "typings"-Ordner finden wir jetzt entsprechend die Typdefinitionen für die Node-Welt. Das gleiche wie erwähnt, machen wir jetzt für Core.js, weil Core.js ein JavaScript-Modul ist, dessen Typdefinitonen uns sonst fehlen würden. Ich rufe den gleichen Befehl auf, aber diesmal entsprechend jetzt hier mit "core-js". Großartig. Wenn ich das ausgeführt habe, finde ich auch Core.js hier als Abhängigkeit. - wurde hier heruntergeladen - und ich muss mir jetzt überhaupt gar keine Gedanken darüber machen, dass mir ein Typ fehlen müsste. Damit ein Entwicklerkollege, der das Projekt mal von mir auschecken sollte, dann nicht das Problem hat, dass er diese Installation wie gesagt von Hand machen muss, kann ich auch hier innerhalb meiner Package.json noch zusätzlich ein weiteres Skript hinzufügen. Das Skript, das ich jetzt hier hinzufüge, heißt "postinstall". Und dieses "postinstall", das sorgt dafür, dass wenn "npm install" ausgeführt wurde, anschließend die Definition des "postinstalls" automatisch durchgeführrt wird, das heißt, die Skripte, die hinter "postinstall" angegeben wurden, also die Kommandos, die dafür definiert wurden, automatisch aufgerufen werden. Und was möchte ich denn aufrufen? Ich mcöhte "typings install" aufrufen. "typings install". Das heißt, sobald das "npm install" durch ist, soll "typings install" aufgerufen werden. Warum möchte ich das? Ich möchte das nicht zwingend per Hand machen müssen, sondern es soll automatisch passieren. Und was macht "typings install"? Ich demonstriere euch das, indem ich den "typings"-Ordner hier mal lösche. Dann ist im Regelfall mein Checkout so, dass er nur aus diesen drei Konfigurationsdateien besteht. Und dann mache ich einen "npm install", dann wird der "node_modules"-Ordner angelegt. Der "node_modules"-Ordner ist zu Ende installiert. "postinstall" wird aufgerufen. Und "postinstall" würde dann an dieser Stelle dann "typings install" aufrufen. Das "typings install" könnten wir theoretisch simulieren hier, indem wir hier ein "npm run" und dann "typings install" einfach aufrufen. Wir können aber auch einfach mal, um das Gesamte zu simulieren, ein "npm install" machen. Das wird nämlich sehr schnell gehen, weil die ganzen Module bereits installiert sind. Dann checkt er das einmal. erkennt, die ganzen Sachen sind installiert und hier hat er "typings install" aufgerufen. Und dieses "typings install", das er hier an dieser Stelle aufruft, erzeugt automatisch mein "typings"-Ordner und in dem "typings"-Ordner sind genau diese Bibliotheken drin, die wir soeben installiert haben und mittels der Option "save" als globale Dependencies hier definiert haben. In diesem Video haben wir also gelernt, wie wir in der Lage sind, mit Typings zu arbeiten und Typdefinitionen zu installieren.

Angular 2 Grundkurs

Lernen Sie Angular 2 von Grund auf kennen und erkunden Sie die Möglichkeiten der Bindungen sowie den Einsatz von Direktiven und Pipes.

4 Std. 37 min (65 Videos)
Derzeit sind keine Feedbacks vorhanden...
 

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!