Webpack: wyjście ciszy

90

Chciałbym wiedzieć, czy istnieje opcja konfiguracji nakazująca webpakowi, aby zapisywał tylko „ważne informacje” do terminala. Prawie tylko błędy i ostrzeżenia, a nie wszystko:

wyjście terminala z webpackiem

Po prostu jest tak dużo wydajności! Chciałbym ukryć typowe rzeczy i mieć tylko webpack wypisywać ostrzeżenia / błędy. Chciałoby rozwiązanie webpack, webpack-dev-serveri karma-webpack.

Uwaga : próbowałem noInfo: truei quiet: trueale nie wydaje się rade.

Edycja: Myślę, że to może nie być możliwe, więc utworzyłem problem na github: https://github.com/webpack/webpack/issues/1191

webpack webpack-dev-server kentcdodds
źródło
Wygląda na to, że w wierszu poleceń noInfoopcja jest w rzeczywistości odwrotnością --info, która jest domyślna, truewięc jeśli uruchomisz webpack-dev-server --info false, powinna zbliżyć się do miejsca, w którym chcesz być.
naartjie
1
Wygląda na to, że działa to na serwerze webpack-dev ... Teraz gdybym tylko mógł go zdobyć do moich testów :-)
kentcdodds
1
Jeśli ktoś jest ciekawy, oto co teraz NODE_ENV=development webpack-dev-server --content-base app/ --port 8888 --colors --progress --info false
wykonuję
1
To również działa:NODE_ENV=development webpack-dev-server --content-base app/ --port 8888 --colors --progress --no-info
kentcdodds
Ach, --no-infodobrze wiedzieć, dzięki
naartjie

Odpowiedzi:

57

W mojej konfiguracji pakietu internetowego, dzięki temu zmniejszyłem mój przyrostowy czas kompilacji o 8 sekund i wyciszono wyjście. Główny tochunks: false

Baw się nim, aby dopasować go do swoich potrzeb

module.exports = {
 devServer: {
  stats: {
    colors: true,
    hash: false,
    version: false,
    timings: false,
    assets: false,
    chunks: false,
    modules: false,
    reasons: false,
    children: false,
    source: false,
    errors: false,
    errorDetails: false,
    warnings: false,
    publicPath: false
  }
 }
}
TetraDev
źródło
4
Działa świetnie! Kluczowe do wyłączenia to hash, version, timings, assets, chunks.
Neal Ehardt
44

👋 Nie potrzebujesz tego wszystkiego. Wszystko, czego potrzebujesz, to

Właściwie te dwa działają świetnie.

stats: 'errors-only',

na końcu eksportowanego obiektu.

Można go również użyć stats: 'minimal',tylko wtedy, gdy wystąpią błędy lub nowa kompilacja. Przeczytaj więcej z oficjalnej dokumentacji Webpacka.

Ahmad Awais
źródło
31

Nie wiem, kiedy ta funkcja została dodana, ale właśnie zauważyłem w dokumentach , że możesz dodać webpackMiddlewarewłaściwość i określić ją noInfo: true. Takie postępowanie usuwa cały hałas! Ale nadal widzisz dane wyjściowe, gdy występują błędy. Yay!

kentcdodds
źródło
11

Masz --displayopcję, która pozwala wybrać poziom ilości informacji, które chcesz wyświetlić.

Od webpack --help:

--display: Select display preset
[string] [choices: "", "verbose", "detailed", "normal", "minimal", "errors-only", "none"]

Jeśli chcesz dokładniej skonfigurować wyświetlane informacje, możesz również skonfigurować swój pakiet sieciowy z polem statystyk w pliku webpack.config.js.

papillon
źródło
8

Jeśli używasz webpack-dev-middleware, możesz wrzucić noInfo: trueobiekt jako drugi parametr. Zakładając również, że masz uruchomiony serwer node / express.

wprowadź opis obrazu tutaj

Twoje zdrowie.

leocreatini
źródło
Publikuję to dla innych osób z podobnym problemem w nieco innej konfiguracji, ponieważ prowadzi je tutaj wyszukiwarka Google.
leocreatini,
1
Możesz również dodać noInfo: truedo devServerelementu konfiguracji w webpack.config.js.
Chad Johnson,
Tylko jeden, który działał dla mnie. Działa również na webpackMiddleware. Dziękuję, bzdury doprowadzały mnie do szału.
Doa
2

Zalecamy konfigurację statystyk poniżej, która zachowa istotne dzienniki i usunie bezużyteczne informacje.

stats: {
  cached: false,
  cachedAssets: false,
  chunks: false,
  chunkModules: false,
  chunkOrigins: false,
  modules: false
}
aaron.xiao
źródło
2

To, co cię interesuje, to moduł (część) pakietu Webpack . Zasadniczo to ten moduł generuje dane wyjściowe . Dane wyjściowe domyślnie zawierają głównie listę zasobów i listę modułów. Możesz ukryć moduły za pomocą dyrektywy. Jeśli chodzi o aktywa, nie ma podobnej opcji. Ale są presety . Możesz określić ustawienie wstępne za pomocą opcji. I ustawione, że aktywa skór jest ... .stats --hide-modules--displaynone

Jest też inny sposób wpływać na statystyki: webpack.config.js. Dodaj, stats: {assets: false, modules: false}aby znacznie zmniejszyć wydajność. Lub stats: 'none'całkowicie wyciszyć Webpack. Nie żebym to polecał. Ogólnie errors-onlyjest do zrobienia. Aby to wpłynęło, webpack-dev-serverumieść to poddevServer kluczem.

Webpack 2.x nie ma --displayopcji. Jedynym sposobem na ukrycie modułów jest --hide-modulesprzełącznik. Rozumiem przez to, że określenie stats: 'errors-only'lub stats: {modules: false}w konfiguracji nie ma żadnego efektu. Ponieważ ten fragment kodu zastępuje to wszystko.

Bo webpack-dev-serversą też --no-infoi --quietopcje.

Więcej informacji o tym, jak to działa. webpack-clitworzy outputOptionsobiekt . Po zakończeniu kompilacji konwertuje statystyki na ciąg znaków i wyświetla je. Stats.toStringkonwertuje statystyki na json , a następnie konwertuje json na ciąg . Tutaj możesz zobaczyć ustawienia domyślne .

x-yuri
źródło
1

Jeśli używasz bezpośrednio interfejsu API Webpack i wywołujesz stats.toString(), możesz przekazać parametry, aby zmniejszyć hałas:

webpack(config).watch(100, (err, stats) => {
  console.log(stats.toString({chunks: false}))
})
Kai Sellgren
źródło