Was ist eigentlich in meinem JSPM produzierten Bundle enthalten

Question

Ich habe kürzlich Angular2 verwendet. Es ist großartig und ich kann ziemlich schnell Sachen zusammensetzen, aber ich kann einfach nicht verstehen, wie ich meine Builds vom Entwickler zum Leben bekomme. Ich habe Artikel für Artikel gelesen, aber es gibt so viele verschiedene Ansätze, Setups und bevorzugte Tools, dass es schwierig ist, ohne eine Menge Vorwissen einen guten Ausgangspunkt zu finden. Also, ich frage mich, ob jemand ein paar Dinge für mich klarstellen kann.

Ich bin wieder auf die 5 Minute Quickstart gegangen und hinzugefügt JSPM vor Ort. Ich betreibe ...

jspm bundle-sfx app/main www/bundle.js 

... und ein Monster JavaScript-Datei in meinem www Ordner bekommen und hier meine Fragen beginnen:

Was wurde in dieser Datei tatsächlich gebündelt?
Ist es nur die Komponenten etc, die ich geschrieben habe - in diesem Fall nur main und app.component - oder haben andere Abhängigkeiten in den Mix auch gegangen?

Wie verwende ich das Bündel?
Angenommen, ich nehme den vorhandenen index.html als Ausgangspunkt und füge hinzu: <script src='www/bundle.js'></script> Was muss ich nun entfernen/hinzufügen/ändern von diesem HTML um index.html und bundle.js zum Server zu schieben und sie als meine App laufen zu lassen?

Ich entschuldige mich für eine eher allgemeine Frage, aber ich bin umgeben von Designern bei der Arbeit und StackOverflow ist mein einziges Ziel für Fragen. Zu meiner Verteidigung habe ich viel darüber gelesen und habe viele verschiedene Seed-Projekte und Ansätze ausprobiert, aber es gibt immer einen Fehler mit einer Abhängigkeit oder einem Skript oder dies oder jenes demontiert. Ich gehe davon aus, dass dies mit Angular2 noch in der Beta-Phase der Fall sein wird, und so wollte ich nur den einfachsten Fall betrachten. Ich weiß, dass ich diesen Aufgaben-Runner nutzen kann, um X zu machen, und dass der Reloader Y macht, aber alles, was ich im Moment will, ist, die Grundlagen zu verstehen, von Dev zu Live mit der einfachsten Build zu gehen.

Vielen Dank für Antworten, Teil Antworten, Links usw. usw.

Answer 1

JSPM auf System.js gebaut wird, das Laden dynamischen Modul ermöglicht. Es ist eine geplante native Funktion in einer zukünftigen Version der JavaScript-Sprache. Es ist nur in Entwurfsform zu dieser Zeit. Sobald es implementiert ist, brauchen wir System.js nicht mehr.

Um Ihre Frage zu beantworten, ist alles, was das Laden dieses dynamischen Moduls und seine Abhängigkeiten ermöglicht, in Ihrer bundle.js-Datei zusammen mit Ihrem App-Code enthalten. Für die Produktion müssen Sie nur diese Datei hochladen und wahrscheinlich Angular (aber ich würde auf CDN verlinken). Vielleicht möchten Sie es zuerst hoggen, um seine Größe zu minimieren. Ich bin nicht positiv JSPM tut das für Sie. Ich verwende normalerweise gulp für Minification und andere Aufgaben.

Im Zweifelsfall die docs lesen.