How to keep whitespace & indentation with Terser plugin in webpack?

Question

How do I build my react app using webpack and skip the part of minimize steps that removes whitespaces. I don't want to turn off minimize but just want to skip whitespace removal. I tried

minimizer: [
      new TerserPlugin({
        parallel: true,
        compress: false,
      }),
    ],

but it didn't do what I wanted.

Is there an option in terser that I can use to skip whitespace removal?

Answer 1

Oohh, it was a hard catch. Terser has beautify option of output. So in Webpack config it looks like this:

optimization: {
    minimizer: [
        new TerserPlugin({
            terserOptions: {
                mangle: false,
                compress: false,
                output: {
                    beautify: true
                }
            }
        })
    ]
}