after displaying "92% chunk asset optimization TerserPlugin", the webpack bundle failed, no error shows. I got exit status 1

[ktknj]

premise

I use webpack4 while developing a laravel app.

# node -v
v16.16.0
# npm -v
9.6.3
# php -v
PHP 7.4.6 (cli) (built: Jun  9 2020 13:55:33) ( NTS )
Copyright (c) The PHP Group
Zend Engine v3.4.0, Copyright (c) Zend Technologies
 

issue

I got a issue below, running "npm run prod" but never get the bundle files.
1 week before now, this issue didnt happen.

# npm run prod
> prod
> npm run production


> production
> cross-env NODE_ENV=production NODE_OPTIONS=--max_old_space_size=4096 node_modules/webpack/bin/webpack.js --progress --hide-modules --stats verbose --config=node_modules/laravel-mix/setup/webpack.config.js

92% chunk asset optimization TerserPlugin

# echo $?
1

action I made

I add the setting on webpack.mix.js and run command again.
I got the bundle files.

mix.webpackConfig({
  optimization: {
    minimize: false
  }
});

wondering how I find the cause of the issue

Now I got the bundle files, so I can deploy my app.
But I have no idea, no clue why this happened.
Currently there is no log, no error discription.
Why 92% chunk asset optimization TerserPlugin got stopped,never end ?

could anyone please give a advice to solve this problem ?

[alexander-akait]

Sorry what is webpack.mix.js? Can you run npm ls webpack?

[ktknj]

thanks for your reply !!

Sorry what is webpack.mix.js?

webpack.mix.js is kinda webpack config rapper file for laravel.

https://github.com/laravel-mix/laravel-mix/blob/master/docs/what-is-mix.md

In a php laravel project, this file is located in root directory.

※ the image below is not my project just a example

Can you run npm ls webpack?

here is the output of npm ls webpack.

# npm ls webpack
my-project@ /var/www/my-project-root-directory
├─┬ laravel-mix@5.0.9
│ ├─┬ babel-loader@8.1.0
│ │ └── webpack@4.43.0 deduped
│ ├─┬ css-loader@1.0.1
│ │ └── webpack@4.43.0 deduped
│ ├─┬ extract-text-webpack-plugin@4.0.0-beta.0
│ │ └── webpack@4.43.0 deduped
│ ├─┬ file-loader@2.0.0
│ │ └── webpack@4.43.0 deduped
│ ├─┬ friendly-errors-webpack-plugin@1.7.0
│ │ └── webpack@4.43.0 deduped
│ ├─┬ optimize-css-assets-webpack-plugin@5.0.3
│ │ └── webpack@4.43.0 deduped
│ ├─┬ terser-webpack-plugin@2.3.7
│ │ └── webpack@4.43.0 deduped
│ ├─┬ vue-loader@15.9.2
│ │ └── webpack@4.43.0 deduped
│ ├─┬ webpack-cli@3.3.11
│ │ └── webpack@4.43.0 deduped
│ ├─┬ webpack-dev-server@3.11.3
│ │ ├─┬ webpack-dev-middleware@3.7.2
│ │ │ └── webpack@4.43.0 deduped
│ │ └── webpack@4.43.0 deduped
│ └─┬ webpack@4.43.0
│   └─┬ terser-webpack-plugin@1.4.4
│     └── webpack@4.43.0 deduped
└─┬ sass-loader@8.0.2
  └── webpack@4.43.0 deduped

# 

[ktknj]

/var/www/my-project-root-directory/node_modules/laravel-mix/setup/webpack.config.js

/**
 * As our first step, we'll pull in the user's webpack.mix.js
 * file. Based on what the user requests in that file,
 * a generic config object will be constructed for us.
 */
let mix = require('../src/index');

let ComponentFactory = require('../src/components/ComponentFactory');

new ComponentFactory().installAll();

require(Mix.paths.mix());

/**
 * Just in case the user needs to hook into this point
 * in the build process, we'll make an announcement.
 */

Mix.dispatch('init', Mix);

/**
 * Now that we know which build tasks are required by the
 * user, we can dynamically create a configuration object
 * for Webpack. And that's all there is to it. Simple!
 */

let WebpackConfig = require('../src/builder/WebpackConfig');

module.exports = new WebpackConfig().build();

/var/www/my-project-root-directory/webpack.mix.js

const mix = require('laravel-mix');


mix.webpackConfig({
  optimization: {
    minimize: false
  }
});


/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

// アプリケーション全体で使用するアセット
mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css');

[alexander-akait]

Oh, looks like you have webpack v4 and faced with old bug with freeze, try to install terser-webpack-plugin@2 and use it (don't forget to disable terser-webpack-plugin@1, because it maybe as a part of default configuration)

[ktknj]

oh, version up terser-webpack-plugin !
I got it !!! thank you so much your advice !! I will try it.

[jonnyeom]

Did this fix it for you?