where to find or how to set htmlWebpackPlugin.options.title in project created with vue cli 3?

Question

I wanted to set title to my webpage created with vue cli 3 and thus looked into public/index.html. There, I found <title><%= htmlWebpackPlugin.options.title %></title>.

How do I set and modify htmlWebpackPlugin.options.title in vue cli 3 project?

Answer 1

create a file vue.config.js at the root

//vue.config.js
module.exports = {
    chainWebpack: config => {
        config
            .plugin('html')
            .tap(args => {
                args[0].title = "My Vue App";
                return args;
            })
    }
}

see https://cli.vuejs.org/guide/webpack.html#modifying-options-of-a-plugin