How can I remove HTML comment in a .vue file?

Question

I build a webpack project, to compile my .vue files.

Then I write some HTML comments in the .vue file, and I build file using webpack, while the mode is "production".

But when I browse the project in browser developer tools, I can catch sight of these HTML comments.

I think that HTML comments can shows up in "development" mode rather than "production" mode.

And their are my files:

webpack.config.js:

const {VueLoaderPlugin} = require('vue-loader');
const TerserPlugin = require('terser-webpack-plugin');
const {resolve} = require('path');
module.exports = {
    mode: 'production',
    devtool: false,
    entry: {
        main: resolve(__dirname, 'src/main.js')
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                use: [
                    {
                        loader: 'vue-loader',
                    },
                ],
            },
        ]
    },
    optimization: {
        minimize: true,
        minimizer: [new TerserPlugin({
            terserOptions: {
                ecma: undefined,
                parse: {},
                mangle: true,
                module: false,
            },
        })],
    },
    plugins: [
        new VueLoaderPlugin(),
    ]
};

App.vue: in /src

<template>
    <!--cumbrous comment-->
    <!--cumbrous comment-->
    <!--cumbrous comment-->
    <!--cumbrous comment-->
    <!--cumbrous comment-->
    <div>
        this is app
    </div>
</template>
<script>
export default {};
</script>

main.js in /src

import {createApp} from 'vue';
import App from './App.vue';

const app = createApp(App);
app.mount('#app');

And this is my package.json:

{
    "name": "delete-vue-comment",
    "version": "1.0.0",
    "main": "src/main.js",
    "license": "MIT",
    "scripts": {
        "dev": "webpack --config webpack.config.js"
    },
    "dependencies": {
        "terser-webpack-plugin": "5.3.1",
        "vue": "3.2.31",
        "vue-loader": "17.0.0",
        "webpack": "5.70.0",
        "webpack-cli": "4.9.2"
    }
}

Of course, this is the DOM element after vue.js rendered:

<div id="app" data-v-app="">
  <!--cumbrous comment-->
  <!--cumbrous comment-->
  <!--cumbrous comment-->
  <!--cumbrous comment-->
  <!--cumbrous comment-->
  <div> this is app </div>
</div>