8 min read

Yo! Npm, bower pls, thx!

Published on
September 15, 2015
Author
Gergely Sipos
Gergely Sipos
Front End Architect
Subscribe to our newsletter
Subscribe
Yo! Npm, bower pls, thx!

Wählen Sie Ihre IDE

Als Erstes müssen Sie Ihre IDE finden. Es gibt eine ganze Reihe von Tools zur Entwicklung von Webanwendungen, aus denen Sie wählen können. NodeJs-basierte Anwendungen werden oft mit kommandozeilenbasierten Tools erstellt, daher gibt es viele verschiedene intelligente Texteditoren, die Sie verwenden können. Die einzige Bedingung ist, dass die IDE über Typescript-Unterstützung verfügen sollte (oder natürlich ein Plugin), aber das ist kein Muss. Es gibt die schwergewichtigen IDEs wie Eclipse, Visual Studio und Webstorm, aber auch leichtgewichtige wie VS Code, Github Atom, Sublime usw. Wählen Sie, was Ihnen am besten gefällt. Ich persönlich verwende Webstorm + VS Code.

Bower - Die ersten Schritte

Sie müssen NodeJs installieren, um den npm (NodeJs Package Manager) zu erhalten. Der npm übernimmt die Verwaltung der Projektabhängigkeit und der Build-Tool-Abhängigkeit (oder devDependency). Nehmen Sie einen leeren Ordner und der Befehl npm init erstellt eine leere package.json für uns. Die package.json enthält einige grundlegende Informationen über das Projekt, die nützlich sind, wenn wir unser Projekt als Node-Paket veröffentlichen wollen, damit andere unsere Anwendung als npm-Abhängigkeit nutzen können. Wir können sogenannte devDependencies hinzufügen, die zur Erstellung unserer Anwendung verwendet werden, wie z.B. gulp, aber sie werden nicht zusammen mit unserer Anwendung bereitgestellt. Wir können natürlich auch "normale" Abhängigkeiten hinzufügen, indem wir angeben, welche Versionen wir benötigen, usw. Nachdem die package.json vollständig ist, kann John Doe, wenn er sie aus dem Versionsverwaltungssystem auscheckt, seine Umgebung mit einem npm install-Befehl einrichten und damit beginnen, sie zu bauen, zu testen und auszuführen.

Sie müssen das nicht von Grund auf tun. Installieren Sie einfach Yeoman und suchen Sie nach einem Generator, der Ihren Anforderungen am besten entspricht. Sie können einen Generator mit dem Befehl yo herunterladen und ausführen. Er funktioniert wie Maven Archetypes. Sie erhalten ein grundlegend konfiguriertes Projekt, um die Entwicklung in Gang zu bringen. Sie können auch Abhängigkeiten mit dem Befehl npm install [Paketname] herunterladen. Wenn Sie das Flag - save hinzufügen, wird dies als Abhängigkeit in der package.json gespeichert. Das - save-dev Flag wird das gleiche tun, nur als devDependency. Ich schlage vor, das private Flag in der package.json auf "true" zu setzen, um zu verhindern, dass npm das Projekt versehentlich veröffentlicht.

Bower einrichten

Okay, es sieht schon ganz gut aus, aber wir haben noch nicht alle Dinge, die wir verwenden wollen. Das Frontend-Zeug von Drittanbietern wird normalerweise von Bower verwaltet. Bower hat ein sehr ähnliches Kommando wie npm, so dass init, install, - save, etc. ziemlich gleich sind. Bower arbeitet mit der Datei bower.json. Die Versionierung der Abhängigkeiten ist bei npm und bower gleich. Beide verwenden node-server, um die Versionen zu analysieren. Sie können Versionsbereiche festlegen und nach Major-, Minor- oder Patch-Versionen filtern, wenn Sie in einer wählerischen Stimmung sind. Toll! Wir haben einen Haufen von Drittanbieter-Zeug, das wir zusammen verkabeln müssen. Das kommt im nächsten Beitrag.

Wollen Sie mehr wissen? Schauen Sie sich diese Links an:

https://www.npmjs.com/

http://expressjs.com/

http://www.typescriptlang.org/

http://bower.io/

http://yeoman.io/

https://angularjs.org/

https://nodejs.org/

https://code.visualstudio.com/

https://docs.npmjs.com/files/package.json

Fortsetzung folgt...

Author
Gergely Sipos
Front End Architect
Subscribe to our newsletter
Subscribe