2016-09-27 4 views
0

Guten Tag, Ich bin Gebäude und eckig 2 App basierend auf dieser starter pack. Ich versuche herauszufinden, wie unser Build-Prozess aussehen wird. Ich habe bemerkt, beim Laufen:HTML im Webpack-Bundle. Warum?

npm run build:prod  
npm run server:prod 

Das html innerhalb des Bündels file.In großen Anwendungen diese Bundle-Datei nach oben 4-5MB sein könnte oder mehr befindet. Dies könnte ein Problem für den mobilen Zugriff sein. Und das scheint dem Winkel 2-Ansatz entgegengesetzt zu sein.

Ist diese richtige Build für eine große Anwendungen? Sollten die HTML-Dateien nicht nach Bedarf und nicht auf einmal geladen werden?

Vielleicht habe ich etwas falsch verstanden.

Antwort

0

Ja im Grunde ist das, was Webpack tut. Es Bündel alles. Es ist sehr wahrscheinlich, dass Ihre Ausgabedatei ~ 4MB ist. Was Sie brauchen, ist die Datei in Stücke zu trennen. Mit dem Common-Chunk-Plugin auf diese Weise können Sie sagen, alle Ihre Drittanbieter-Bibliotheken in einem Stück zu bringen.

Zweitens können Sie die Datei weiter in mehrere Chunks aufteilen und sie dann asynchron laden.

können Sie mehr darüber in der link finden.

+0

Webpack-Dokumentation ist Mist. Ich weiß, wie man die Dateien mit dem Plugin erzeugt, aber ich weiß nicht, wie man es in einer angular 2 App implementiert. Hast du irgendwelche Beispiele? –

+0

Leider habe ich keine Beispiele mit Angular 2, ich arbeite nur mit React und Vue.js. Aber das Prinzip sollte das gleiche sein. Sie können die 'require.ensure' beispielsweise in Ihren Routen oder in Ihrem' html' hinzufügen. Wenn Sie dann zu einer bestimmten Route navigieren, werden nur die mit dieser Seite verknüpften Elemente geladen. Macht Sinn? – highFlyingDodo