Ich muss eine Fortschrittsanzeige anzeigen, während Webpack Chunks vom Server geladen werden. Gibt es eine einfache Lösung, um dies zu erreichen? Ich würde erwarten, dass dafür bereits ein Plugin existiert, aber eine schnelle Suche bei Google ergab keine.Webpack Chunk Lade Fortschritt
Dank
--UPDATE-- My Apologies hatte ich die Frage falsch verstanden aber ich werde nur hier leben diese Antwort, da es eine Art, um es betrifft.
Ich glaube, was Sie suchen ist: "Fortschritt-Bar-webpack-Plugin" nur npm Sie auf diese installieren:
npm installieren Fortschritt-Bar-webpack- Plugin -D
Dann schließen sie es in Ihren webpack Plugin Konfigurationen wie so:
plugins: [
new ProgressBarPlugin()
]
Es gibt mehr Optionen, die Sie auch zu diesem Plugin hinzufügen, die Sie hier sehen können: https://www.npmjs.com/package/progress-bar-webpack-plugin
Es gibt auch ein anderes Plugin dies für Sie tun. Es heißt ProgressPlugin, außer dass dies eine Liste aller gebauten Module und den Prozentsatz anstelle einer Fortschrittsleiste erstellt.
Hier ist ein Beispiel-Implementierung:
new webpack.ProgressPlugin(function handler(percentage, msg) {
var p = Math.floor(percentage * 100);
if (config.percent !== p) {
config.percent = p;
console.log(msg, config.percent + '%');
}
}),
Fügen Sie einfach diese zu Ihrem webpack Plugins und es wird über die Fortschritte bei den im Terminal eingebauten Module zeigen.
Entweder funktioniert es gut, ich mag den Fortschrittsbalken am liebsten, da ich keine riesige Liste in meinem Terminal sehen will. Deine Entscheidung! :)
Das ist nicht, was ich in der Frage gemeint habe. Ich bin nicht an dem Fortschritt des Build-Prozesses interessiert, wenn ich die App erstelle. Ich bin daran interessiert, dem Benutzer, der meine App verwendet, eine Fortschrittsanzeige anzuzeigen, während die Apps-Chunks vom Server geladen werden. – nutrina
Ich entschuldige mich, weil ich Ihre Frage falsch verstanden habe. Hmm, ich bin mir nicht sicher, ob ich diese Antwort löschen soll oder nicht. Macht nichts dagegen. Ich sehe jedoch, was Sie suchen, ist eine Fortschrittsanzeige interagiert mit dem Benutzer und Ihrem Server. Ich habe auch versucht, danach zu suchen, und ich hatte keinen Erfolg. Dieses Plugin benötigt möglicherweise eine Socket-Verbindung, damit dies möglich ist. Dies könnte tatsächlich etwas sein, das jemand für das Webpack erstellen kann, da ich glaube, dass es derzeit nicht existiert. –
require.ensure gibt ein Versprechen. Damit können Sie angeben, ob ein Chunk geladen wurde oder nicht:
//entry.js
console.log('loading my chunk...);
let chunkPromise = require.ensure([],() => {
require('./my-module');
});
chunkPromise
.then(() => console.log('chunk loaded'))
.catch(e => console.error('chunk failed to load'));
Fantastische Frage. Ich weiß, dass der Callback-Name standardmäßig 'webpackJsonP' ist, also können Sie affe-patchen, um herauszufinden, wann es fertig ist, aber der Rest ist intern auf' define' definiert. Funktion/Modul –
Idealerweise könnte Webpack ein Event bereitstellen API für Chunk-Lade-Status, aber Sie müssten es mit Webpack-Core aufnehmen: https://github.com/webpack/webpack/issues –