Wie kann man Webpack weniger ausführlich machen?

Sie können die --display-Option der Webpack-CLI verwenden, um die Ausführlichkeit der Statistikausgabe festzulegen. Hier sind die verfügbaren Werte .

Z.B.

--display=minimal

Ich habe Haken's grep-Anweisung etwas geändert, so dass es beim ersten Laden und beim Aktualisieren von JS-Dateien funktioniert.

Hier ist das Code-Snippet in meiner package.json.

scripts": {
    "dev": "npm run dev | grep -v \"\\[\\d*\\]\""
}

Dadurch werden alle Zeilen herausgefiltert, die Muster wie [231], [232] usw. enthalten.

Verwenden Sie die Statistikoptionen des Webpacks.

So entfernen Sie beispielsweise die Hunderte von Zeilen, die von Abschnitten generiert werden

stats: {
    chunks: false
}

So entfernen Sie Informationen zu Modulen:

stats: {
    chunkModules: false
}

Siehe die Statistikdokumentation für viele weitere Optionen.

Aus Webpack-Dokumenten:

Mit der Statistik-Option können Sie genau steuern, welche Bundle-Informationen angezeigt werden. Dies kann ein schöner Mittelweg sein, wenn Sie nicht quiet oder noInfo verwenden möchten, weil Sie einige Bündelinformationen wünschen, jedoch nicht alle.

Für webpack-dev-server muss diese Eigenschaft im devServer-Objekt vorhanden sein.

//example with module.exports in webpack.config.js
module.exports = {
  //...
  stats: 'minimal'
};

//example with dev-sever in webpack.config.js
dev-sever: {
  //...
  stats: 'minimal'
}

In den Dokumenten finden Sie weitere Optionen wie errors-only, none, verbose und mehr.

ref: https://webpack.js.org/configuration/stats/

Wenn Sie karma-webpack verwenden, können Sie dies in Ihre Konfigurationsdatei einfügen:

webpackMiddleware: {
 noInfo: true,
 stats: 'errors-only'
}

noInfo: false keine Informationen zur Konsole anzeigen (nur Warnungen und Fehler) Dokumentation

stats: 'errors-only' nur bei Fehlern ausgeben Dokumentation

Mit einer Webpack-Dev-Server-Konfigurationsdatei können Sie eine Verbindung mit der API herstellen.

Mit noInfo: true werden Informationsnachrichten deaktiviert, es sei denn, Sie haben einen Fehler.

Mit quiet: true werden alle Konsoleninformationen entfernt, auch Fehler.

Referenz: https://webpack.github.io/docs/webpack-dev-server.html#api

quiet und no-info haben nichts Nützliches für mich getan. Stattdessen verwendete ich einen grep-Filter. 

npm run dev | grep -v "node_modules\|\[built\]"

Dadurch werden alle Zeilen entfernt, die [built] oder node_modules enthalten. Dadurch können Sie die tatsächlichen Build-Fehler leichter erkennen, ohne durch mehrere Zeilen der Terminalausgabe scrollen zu müssen. 

Ich habe dies in den Abschnitt scripts meiner package.json eingefügt, damit ich npm run dev-quiet verwenden kann, um das gefilterte Ausgabeprotokoll abzurufen.

Führen Sie webpack mit der Option --hide-modules aus.

Wenn Sie die express-Version verwenden, können Sie die noInfo-Option hinzufügen:

import webpackMiddleware from 'webpack-dev-middleware';

app.use(webpackMiddleware(compiler, {
  noInfo: true
}));

Bei der Verwendung von webpack-dev-middleware müssen Sie jetzt logLevel anstelle von noInfo in den Konfigurationsoptionen verwenden ( Stand vom 18.12.17 ).

Beispiel:

require("webpack-dev-middleware")(compiler, {
    logLevel: "warn", // set the logLevel
});