Немного важно понять здесь: пакет
- . json содержит npm таких команд, как
npm run development, npm run production - , вот как это можно сделать выглядит так:
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
- вывод прогресса инициируется аргументом
--progress в вышеупомянутой команде - вывод прогресса использует ProgressPlugin в фоновом режиме
Идея состоит в том, чтобы удалить аргумент --progress из команды, чтобы он выглядел как
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
, но чтобы создать его вручную как плагин, например, в webpack.mix.js:
mix.webpackConfig({
plugins: [
new webpack.ProgressPlugin((percentage, message) => {
// An idea to show the line only if percentage is divisible by 5.
if (percentage * 100 % 5 === 0) {
console.log(`${(percentage * 100).toFixed()}% ${message}`);
}
})
],
});
Вот как может выглядеть пересмотренный вывод:
0% compiling
10% building
10% building
25% building
40% building
40% building
70% building
70% building
70% finish module graph
70% finish module graph
75% module optimization
70% building
70% building
80% chunk modules optimization
85% chunk reviving
85% chunk reviving
95% emitting
95% emitting
Идея заимствована из этой статьи, объясняющей как работает ProgressPlugin