1
00:00:00,025 --> 00:00:05,570
[MUSIC]

2
00:00:05,570 --> 00:00:09,319
Im vorherigen Kurs auf Bootstrap 4

3
00:00:09,319 --> 00:00:14,613
haben wir gelernt, wie man entweder NPM-Skripte oder Grunt oder

4
00:00:14,613 --> 00:00:21,220
Gulp benutzt, um den Distributionsordner für unsere Webanwendung zu erstellen.

5
00:00:21,220 --> 00:00:27,040
So haben wir gesehen, wie der Distributionsordner erstellt wird, indem alle HTML-,

6
00:00:27,040 --> 00:00:30,270
CSS- und JavaScript-Dateien verwendet werden.

7
00:00:30,270 --> 00:00:35,540
Und dann machen Sie Modifikation, Hässlichkeit, Verkettung

8
00:00:35,540 --> 00:00:40,490
und verschiedene andere Transformationen auf diesen, um Distributionsdateien zu erstellen, die

9
00:00:40,490 --> 00:00:48,470
einfach auf den Server kopiert werden können und dann Ihre Website für Benutzer zur Verfügung zu stellen.

10
00:00:48,470 --> 00:00:52,050
Was ist mit Ihrer Angular-Anwendung?

11
00:00:52,050 --> 00:00:57,240
Wie verpacken wir unsere Angular-Anwendung, um sie auf einer Website bereitzustellen?

12
00:00:57,240 --> 00:01:01,670
Jetzt, wie Sie erkennen, Ihre eckige Anwendung wird letztlich auch auf

13
00:01:01,670 --> 00:01:06,630
einer Website bereitgestellt werden, von der aus Menschen auf Ihre Angular-Anwendung zugreifen,

14
00:01:06,630 --> 00:01:09,350
laden Sie die Angular-Anwendung in den Browser und

15
00:01:09,350 --> 00:01:13,780
dann wird ihre eckige Anwendung zum Leben in ihren Browsern erwecken.

16
00:01:14,810 --> 00:01:19,430
Wir werden, auch auf die eckige Art und Weise der Ausrichtung auf

17
00:01:19,430 --> 00:01:23,890
mobile Geräte in den nächsten zwei Kursen, in dieser Spezialisierung.

18
00:01:23,890 --> 00:01:27,770
Deshalb spreche ich im Moment nicht speziell darüber.

19
00:01:27,770 --> 00:01:32,180
Aber hier sprechen wir darüber, wie man ein Webbrowser-Fenster anvisiert.

20
00:01:32,180 --> 00:01:35,150
Verwenden Sie Ihren Angular-Anwendungscode.

21
00:01:35,150 --> 00:01:38,050
Kommen Sie also zu der Frage, wie verpacken wir unsere

22
00:01:38,050 --> 00:01:40,090
Angular-Anwendung für die Bereitstellung?

23
00:01:40,090 --> 00:01:47,850
Jetzt könnten wir die großen Gulp- und NPM-Skripte verwenden, wenn Sie sich dafür entscheiden.

24
00:01:47,850 --> 00:01:53,290
Aber es gibt ein neues Kind auf dem Block namens Webpack.

25
00:01:53,290 --> 00:01:59,540
Webpack, wie wir ziemlich bald verstehen würden, ist ein Modul-Bundler.

26
00:01:59,540 --> 00:02:03,040
Jetzt werden wir uns einige Details in den nächsten Folien ansehen.

27
00:02:03,040 --> 00:02:08,150
Also, was Webpack Sie tun können, ist, Ihre Angular-Anwendung so zu verpacken

28
00:02:08,150 --> 00:02:11,720
, dass es einfach ist, auf einer Website bereitzustellen und

29
00:02:11,720 --> 00:02:15,470
Ihre Angular-Anwendung für Benutzer verfügbar zu machen.

30
00:02:15,470 --> 00:02:22,070
Jetzt, da wir Angular CLI zum Erstellen unserer Angular-Anwendung verwenden,

31
00:02:22,070 --> 00:02:26,040
nutzt Angular CLI bereits Webpack für die

32
00:02:26,040 --> 00:02:32,010
Erstellung des Distributionsordners für Ihre Angular-Anwendung.

33
00:02:32,010 --> 00:02:38,780
Wir müssen also keine zusätzliche Arbeit explizit machen, um Webpack zu nutzen.

34
00:02:38,780 --> 00:02:40,700
Sobald wir Angular CLI verwenden.

35
00:02:40,700 --> 00:02:45,870
Denn die Angular CLI kümmert sich um all das schwere Heben in unserem Namen.

36
00:02:45,870 --> 00:02:50,664
Also, bevor wir sehen, was die Angular CLIs Art, Ihre

37
00:02:50,664 --> 00:02:53,022
Distribution zu bauen weiter zu erleichtern.

38
00:02:53,022 --> 00:02:57,162
Wir müssen ein paar Konzepte über Webpack und

39
00:02:57,162 --> 00:03:00,566
wie Webpack in ein wenig Detail funktioniert verstehen

40
00:03:00,566 --> 00:03:06,270
, so dass, wenn Angular CLI den Distributionsordner erzeugt, Sie

41
00:03:06,270 --> 00:03:10,410
sehen können, was genau von Angular CLI erstellt wird.

42
00:03:10,410 --> 00:03:14,150
Mein Ziel dieser

43
00:03:14,150 --> 00:03:18,950
Vorlesung ist es, Ihnen nur einen kurzen Überblick über webpack zu geben.

44
00:03:18,950 --> 00:03:23,770
Dieser Vortrag ist keine Einführung in die Verwendung von Webpack.

45
00:03:23,770 --> 00:03:26,400
Das geht über den Rahmen dieses Kurses hinaus, aber

46
00:03:26,400 --> 00:03:30,980
wenn Sie interessiert sind,

47
00:03:30,980 --> 00:03:36,280
hat die Webpacks-Website viele Informationen darüber, wie Webpack für andere Anwendungen verwendet werden kann.

48
00:03:36,280 --> 00:03:39,800
Sie können im Prinzip webpack verwenden, um Ihre

49
00:03:41,350 --> 00:03:44,680
Bootstrap-Anwendung, die Sie im vorherigen Kurs entwickelt haben, auch zu verpacken.

50
00:03:46,080 --> 00:03:50,680
Aber in diesem Moment werden wir uns ansehen, wie wir Webpack

51
00:03:51,840 --> 00:03:57,640
als Teil der Angular CLI-Methode nutzen, um unsere eckige Interpretation zu erstellen.

52
00:03:59,640 --> 00:04:02,890
Also offensichtlich ist die erste Frage, die sich in Ihrem Kopf stellt,

53
00:04:02,890 --> 00:04:04,410
was genau ist Webpack?

54
00:04:04,410 --> 00:04:06,150
Wovon reden wir?

55
00:04:06,150 --> 00:04:12,850
Webpack, dies ist die Definition aus der Webpack-Dokumentation selbst.

56
00:04:12,850 --> 00:04:19,130
Es sagt, webpack ist ein Modul-Bundler für moderne JavaScript-Anwendungen.

57
00:04:19,130 --> 00:04:21,723
Ihre Angular-Anwendung, an der Sie

58
00:04:21,723 --> 00:04:24,530
bisher gearbeitet haben, ist eine einfache moderne JavaScript-Anwendung.

59
00:04:24,530 --> 00:04:29,590
Jetzt arbeiten Sie alle mit dem neuesten Stand der Angular Technologie.

60
00:04:29,590 --> 00:04:35,170
Und so, offensichtlich qualifiziert es sich als eine moderne JavaScript-Anwendung und

61
00:04:35,170 --> 00:04:38,570
daher ist die Verwendung von Webpack durchaus sinnvoll.

62
00:04:38,570 --> 00:04:40,980
Was Webpack am besten ist,

63
00:04:40,980 --> 00:04:45,720
betrachtet es die gesamte Struktur Ihrer Angular-Anwendung.

64
00:04:45,720 --> 00:04:50,610
Es durchläuft also rekursiv Ihren Code Ihrer

65
00:04:50,610 --> 00:04:54,980
Angular-Anwendung, um zu sehen, wie Sie

66
00:04:54,980 --> 00:05:00,680
die Informationen am besten in das bündeln, was als Bundles bezeichnet wird.

67
00:05:00,680 --> 00:05:05,947
Wenn Webpack Ihren Code anschaut, behandelt es jede Datei, die Sie

68
00:05:05,947 --> 00:05:12,735
in Ihrer Angular-Anwendung haben, sei es ein JavaScript der Typescript-Datei,

69
00:05:12,735 --> 00:05:17,319
sei es eine CSS-Datei, sei es eine SAS-Datei, sei es eine Bilddatei.

70
00:05:17,319 --> 00:05:21,781
Was auch immer, es behandelt jeden von ihnen als Module aus seiner Perspektive,

71
00:05:21,781 --> 00:05:25,438
und dann entscheidet es, was der beste Weg ist, diese

72
00:05:25,438 --> 00:05:30,790
Module in das zu verpacken, was als Bundles bezeichnet werden, die von der heruntergeladen werden können.

73
00:05:30,790 --> 00:05:36,060
Server zu Ihrem Web-Browser in einer komfortablen und bequemen Weise.

74
00:05:37,350 --> 00:05:42,820
Wenn wir also über Webpack sprechen, müssen wir natürlich klären, was ein Bündel bedeutet.

75
00:05:42,820 --> 00:05:47,315
Wie ich in der vorherigen Folie kurz erwähnt habe, ist ein Bundle nichts anderes als

76
00:05:47,315 --> 00:05:51,155
eine JavaScript-Datei, die Assets enthält.

77
00:05:51,155 --> 00:05:56,130
Nun müssen Sie dies im Hinterkopf behalten, dass Webpack alles als JavaScript behandelt.

78
00:05:56,130 --> 00:06:02,410
Um es, ob es sich um CSS oder eine der anderen Arten von Dateien handelt,

79
00:06:02,410 --> 00:06:05,930
werden sie auch aus der Perspektive von Webpack als JavaScript behandelt. Machen Sie sich

80
00:06:05,930 --> 00:06:10,790
jetzt nicht zu besorgt, webpack weiß, wie man sie packt und

81
00:06:10,790 --> 00:06:15,470
sie als JavaScript-Bundles behandelt, wo es diese Bundles vorbereitet.

82
00:06:15,470 --> 00:06:19,740
Oder JavaScript-Module, in denen es diese Bundles vorbereitet.

83
00:06:19,740 --> 00:06:26,290
Ein Bundle ist also etwas, das Module zusammenfasst, die zusammengehören.

84
00:06:26,290 --> 00:06:29,010
Wenn ich über Modul spreche, impliziere ich kein Angular-Modul,

85
00:06:29,010 --> 00:06:30,690
ich impliziere kein JavaScript-Modul.

86
00:06:32,220 --> 00:06:36,170
Wie gesagt und Webpack, jede Datei wird als Modul erstellt.

87
00:06:36,170 --> 00:06:40,820
Und so bündelt es diese Module zusammen,

88
00:06:40,820 --> 00:06:46,160
die dem Client in einer einzigen Antwort auf eine Anfrage serviert werden sollten.

89
00:06:47,200 --> 00:06:51,740
So trifft webpack selbst eine Entscheidung darüber, welche

90
00:06:51,740 --> 00:06:55,070
Teile zu einem Bündel zusammengefügt werden sollen.

91
00:06:55,070 --> 00:06:59,000
Und sollte zusammen geliefert werden, so dass das Rendering Ihrer

92
00:06:59,000 --> 00:07:04,120
Web-Anwendung in der effektivsten Weise durchgeführt wird.

93
00:07:04,120 --> 00:07:09,190
Nun hat Angular CLI bereits seine Konfiguration erstellt, wie man

94
00:07:09,190 --> 00:07:17,370
die Angular Assets am besten verpacken kann, so dass es am bequemsten an den Browser geliefert wird.

95
00:07:17,370 --> 00:07:21,550
Wir müssen uns also keine Gedanken darüber machen, wie wir das selbst machen,

96
00:07:21,550 --> 00:07:25,490
wir überlassen es der eckigen CLI-Logik, um sich um all diese Konfiguration zu kümmern

97
00:07:25,490 --> 00:07:29,540
, wie dieses Pack seine Bundles in unserem Namen erstellt.

98
00:07:29,540 --> 00:07:33,190
Was Webpack also tut, ist, es beginnt auf der obersten Ebene.

99
00:07:33,190 --> 00:07:38,450
In Ihrer Angular-Anwendung ist die oberste Ebene index.html und main.js Dateien,

100
00:07:38,450 --> 00:07:43,930
wie wir in der allerersten Lektion dieses Kurses gelernt haben.

101
00:07:43,930 --> 00:07:49,170
Es beginnt also dort, und dann folgt es allen Eingaben

102
00:07:49,170 --> 00:07:54,630
, die Sie in den Pfad verwenden, und

103
00:07:54,630 --> 00:08:00,760
bringt eine hierarchische Organisation aller verschiedenen Teile auf.

104
00:08:00,760 --> 00:08:06,110
Was also ein Abhängigkeitsdiagramm genannt wird, wird von Webpack erstellt.

105
00:08:06,110 --> 00:08:10,840
Mit diesem Abhängigkeitsdiagramm entscheidet Webpack dann, wie

106
00:08:10,840 --> 00:08:15,810
seine Bundles gepackt werden sollen und dass ein oder mehrere Bundles abbildet, da sie

107
00:08:15,810 --> 00:08:21,630
für Ihre bestimmte Anwendung sinnvoll sind, dass Webpack Bundle ist.

108
00:08:21,630 --> 00:08:27,690
Und dabei, wenn es Nicht-JavaScript-Dateien

109
00:08:27,690 --> 00:08:34,440
wie CSS, HTML und ein SAS oder Images behandelt und so weiter.

110
00:08:34,440 --> 00:08:38,240
Dann verwendet es Plugins, die es Ihnen ermöglichen,

111
00:08:38,240 --> 00:08:41,910
diese Dateien, diese Nicht-JavaScript-Dateien, vorzuverarbeiten und zu modifizieren,

112
00:08:41,910 --> 00:08:46,970
so dass sie in Ihre Webpack-Bundles gebündelt werden können.

113
00:08:49,082 --> 00:08:52,070
Wenn Sie webpack von Grund auf verwenden,

114
00:08:52,070 --> 00:08:57,510
würden Sie einige der Konfiguration beschreiben, damit Ihr Webpack funktioniert.

115
00:08:57,510 --> 00:09:00,775
Auf diesen Dateien in einer Datei namens

116
00:09:00,775 --> 00:09:06,810
webpack.config.js, die wir in den Stammordner Ihrer Anwendung aufgenommen.

117
00:09:06,810 --> 00:09:11,640
In unserem Fall, da wir uns auf Angular CLI verlassen, um dies in unserem Namen zu tun,

118
00:09:11,640 --> 00:09:16,470
klickt Angular CLI automatisch hier auf die Konfiguration für

119
00:09:16,470 --> 00:09:18,300
Webpack zu erstellen, mit der Webpack zu arbeiten.

120
00:09:18,300 --> 00:09:23,260
Wenn wir nun über Webpack sprechen, gibt es vier Konzepte, die für

121
00:09:23,260 --> 00:09:26,660
uns wichtig sind, um zu verstehen, wie Webpack auf Bildern funktioniert.

122
00:09:26,660 --> 00:09:28,740
Der erste ist der Eintrag.

123
00:09:28,740 --> 00:09:33,560
Eintrag ist der Punkt, an dem das Webpack beginnen und

124
00:09:33,560 --> 00:09:36,350
folgen soll, um das Abhängigkeitsdiagramm zu erstellen.

125
00:09:36,350 --> 00:09:40,260
So ist die Datei main.ts zum Beispiel ein Einstiegspunkt.

126
00:09:40,260 --> 00:09:44,490
So kann Webpack seine Jagd beim Erstellen des Abhängigkeitsdiagramms beginnen.

127
00:09:44,490 --> 00:09:50,860
Direkt bei main.ts und dann gehen Sie nach allen Importanweisungen von dort in

128
00:09:50,860 --> 00:09:56,160
ihre anderen Dateien und dann importieren sie diese Dateien und

129
00:09:56,160 --> 00:10:01,490
so weiter bis zum Aufbau des Abhängigkeitsdiagramms.

130
00:10:02,930 --> 00:10:06,660
Nun, der zweite Teil ist, was wir als Ausgabe nennen würden.

131
00:10:06,660 --> 00:10:11,200
In webpack ist die Ausgabe der Satz von Bundles, die webpack in

132
00:10:11,200 --> 00:10:11,740
Ihrem Namen vorbereitet.

133
00:10:12,890 --> 00:10:15,590
Der dritte ist Lader.

134
00:10:15,590 --> 00:10:18,950
Jetzt versteht Webpack, wie ich sagte, nur JavaScript und

135
00:10:18,950 --> 00:10:21,540
es weiß nur, wie man mit JavaScript arbeitet.

136
00:10:21,540 --> 00:10:26,250
Aber wie ich auch erwähnt habe, behandelt webpack jede Datei als Modul.

137
00:10:26,250 --> 00:10:31,660
Also diese Dateien, die nicht JavaScript sind, müssen

138
00:10:31,660 --> 00:10:36,870
transformiert und dann mit

139
00:10:36,870 --> 00:10:42,300
entsprechenden Transformationen in Ihre Bundles gesetzt werden und dann werden sie in Ihrem Abhängigkeitsdiagramm hinzugefügt.

140
00:10:42,300 --> 00:10:45,420
Hier kommt die Verwendung der verschiedenen Plugins ins Spiel.

141
00:10:45,420 --> 00:10:47,320
Was helfen Plugins Ihnen dabei?

142
00:10:47,320 --> 00:10:51,920
Die Plugins helfen Ihnen, die verschiedenen Aktionen und benutzerdefinierten Funktionalitäten

143
00:10:51,920 --> 00:10:58,020
oder Kompilierungen auszuführen, die Sie für den Aufbau Ihrer Bundles tun müssen.

144
00:10:58,020 --> 00:11:02,820
So wird es Ihnen helfen, Ihr CSS in eine Weise zu verwandeln, die ich

145
00:11:02,820 --> 00:11:06,830
in Ihre JavaScript-Bundles verpacken kann, und so weiter.

146
00:11:06,830 --> 00:11:12,570
Das ist also eine kurze Einführung, wie Webpack tatsächlich funktioniert.

147
00:11:12,570 --> 00:11:17,420
Nun, mit dieser schnellen Einführung, werden Sie in der nächsten Übung

148
00:11:17,420 --> 00:11:22,750
sehen, dass wir bequem einen Befehl namens ng

149
00:11:22,750 --> 00:11:28,360
build verwenden, um unseren Distributionsordner für unsere Angular-Anwendung zu erstellen.

150
00:11:28,360 --> 00:11:31,690
Ng build ermöglicht es Ihnen, sogar eine Entwicklungsversion oder

151
00:11:33,380 --> 00:11:36,440
Produktionsversion Ihrer Angular-Anwendung zu erstellen.

152
00:11:36,440 --> 00:11:38,790
Als wir ng surfen,

153
00:11:38,790 --> 00:11:43,270
nutzte die Angular CLI tatsächlich Webpack, um Dinge zu packen.

154
00:11:43,270 --> 00:11:44,350
Wenn Sie also zurückgehen und

155
00:11:44,350 --> 00:11:50,630
sich all die Dinge ansehen, die in Ihrem Terminal-Fenster gedruckt wurden,

156
00:11:50,630 --> 00:11:55,910
werden Sie beginnen, Webpack hinter den Kulissen zu sehen, um die Bundles zu machen.

157
00:11:57,070 --> 00:12:01,760
Jetzt erstellen Sie in der nächsten Übung ihren Distributionsordner

158
00:12:01,760 --> 00:12:08,840
, der dann auf Ihre Website kopiert werden kann und dann Ihre Angular-Anwendung bereitstellen kann.

159
00:12:08,840 --> 00:12:12,020
Jetzt habe ich bereits einen Build

160
00:12:12,020 --> 00:12:15,570
der Angular-Anwendung gemacht, die wir bisher gebaut haben.

161
00:12:15,570 --> 00:12:20,380
Lassen Sie uns also einen kurzen Blick auf den Distributionsordner werfen, um zu sehen, was sich

162
00:12:20,380 --> 00:12:24,370
dort befindet, bevor Sie tatsächlich die Übung machen.

163
00:12:24,370 --> 00:12:28,520
Sobald Sie die Übung abgeschlossen haben, würde ich Ihnen dringend empfehlen, sich

164
00:12:28,520 --> 00:12:36,140
den Festplattenordner anzusehen, der in Ihrem Projektordner für Angular-Anwendungen erstellt wurde.

165
00:12:36,140 --> 00:12:40,940
Und dann sehen Sie genau die Dateien, die ich Ihnen jetzt zeigen werde.

166
00:12:40,940 --> 00:12:44,020
Direkt im Distributionsordner. Wenn Sie

167
00:12:44,020 --> 00:12:50,890
hier zu unserer Angular-Anwendung im Visual Studio gehen,

168
00:12:50,890 --> 00:12:53,950
sehen Sie, dass ich jetzt den Distributionsordner öffne.

169
00:12:53,950 --> 00:12:58,260
Und im Distributionsordner sehen Sie hier eine ganze Reihe von Dateien.

170
00:12:58,260 --> 00:13:03,905
Sie werden eine Datei mit dem Namen main eine lange Zeichenfolge sehen, wo

171
00:13:03,905 --> 00:13:09,890
.bundle.js von Ihrem Wissen über Gulp und Grunt aus dem vorherigen Kurs,

172
00:13:09,890 --> 00:13:14,620
Sie werden beginnen zu sehen, was diese mittlere lange Zeichenfolge bedeutet.

173
00:13:14,620 --> 00:13:19,830
Auf diese Weise fügen Sie diese Versionierung Ihrer Anwendung hinzu.

174
00:13:19,830 --> 00:13:25,310
Ähnlich sehen Sie eine andere Datei namens styles.something.css.

175
00:13:25,310 --> 00:13:28,834
Dann sehen Sie eine vendor.bundle.js.

176
00:13:28,834 --> 00:13:31,319
Und dann polyfills.js.

177
00:13:31,319 --> 00:13:34,300
Dann haben Sie eine Datei index.html, und

178
00:13:34,300 --> 00:13:37,350
Sie fragen sich, was mit all Ihrem HTML-Code passiert ist?

179
00:13:37,350 --> 00:13:39,970
Es ist in einem dieser Bündel da, okay.

180
00:13:39,970 --> 00:13:43,610
Also alle Vorlagen, die Sie geschrieben haben, sind alle in einem dieser Bundles vorhanden,

181
00:13:43,610 --> 00:13:45,670
außer der Seite index.html.

182
00:13:45,670 --> 00:13:51,206
Sie benötigen die Seite index.html explizit, weil,

183
00:13:51,206 --> 00:13:54,348
wenn ein Benutzer die URL für

184
00:13:54,348 --> 00:13:59,024
Ihre Website in die Adressleiste des Browsers eingibt.

185
00:13:59,024 --> 00:14:01,624
Dann würden Sie auf Ihrer Website und

186
00:14:01,624 --> 00:14:05,362
den Indexpunkt-HTML-Seiten landen, auf denen

187
00:14:05,362 --> 00:14:11,400
Sie alles starten und das brauchen, um Ihre Angular-Anwendung zu booten, so dass das da ist.

188
00:14:11,400 --> 00:14:16,170
Und dann sehen Sie auch die Fontawesome-Dateien dort, die notwendig sind und

189
00:14:16,170 --> 00:14:21,340
dass innerhalb des Assets Sie einige Bilder dort sehen, im Assets-Ordner.

190
00:14:22,530 --> 00:14:28,980
Wenn Sie also einen kurzen Blick auf die Hauptdatei werfen, werden Sie sehen, dass dies ist,

191
00:14:28,980 --> 00:14:35,185
wie Sie sehen können, ist eine Menge komprimierter verketteter Satz von Dateien.

192
00:14:35,185 --> 00:14:40,025
Nun, wenn Sie versuchen, das zu lesen, wird es nicht einfach sein,

193
00:14:40,025 --> 00:14:42,455
es ist eine riesige Datei mit vielen Dingen.

194
00:14:42,455 --> 00:14:46,695
Dies ist auch alle Angular Frameworks Code,

195
00:14:46,695 --> 00:14:49,140
eine Hand Ihren Code, den Sie geschrieben haben.

196
00:14:49,140 --> 00:14:53,980
Und der Code, der von Angular Material, Flex Layout und

197
00:14:53,980 --> 00:14:58,460
jeder anderen Sache kommt, die Sie in Ihrer Angular-Anwendung enthalten haben.

198
00:14:58,460 --> 00:15:02,480
In ähnlicher Weise haben Sie Polyfills und dann Stile und

199
00:15:02,480 --> 00:15:07,130
Sie beginnen zu sehen, dass alle Dinge, die Sie in Ihrer

200
00:15:07,130 --> 00:15:10,870
Angular-Anwendung verwenden, in diesen Dateien gebündelt wurden.

201
00:15:12,270 --> 00:15:17,220
So hoffe ich, dass Sie einen schnellen Überblick über webpack bekommen.

202
00:15:17,220 --> 00:15:21,100
Jetzt ist es Zeit für uns, zu der Übung zu gehen, wo wir einfach den

203
00:15:21,100 --> 00:15:26,660
Angular CLI ng build Befehl verwenden, um diesen Distributionsordner zu erstellen.

204
00:15:26,660 --> 00:15:30,810
Und Sie werden sehen, wie Sie Ihre Angular-Anwendung auf einer Website bereitstellen können.

205
00:15:31,870 --> 00:15:37,329
Direkt nachdem Sie den Build abgeschlossen haben.

206
00:15:37,329 --> 00:15:39,969
( MUSIK)