htmlWebpackPlugin.options.title を設定する方法

vue cliでプロジェクトを作成すると public/index.html にはページタイトルとして以下のように記述されます。

<title><%= htmlWebpackPlugin.options.title %></title>

HTMLページのタイトルを付けるためにこの htmlWebpackPlugin.options.title の値を設定するには、プロジェクトのルートディレクトリに vue.config.js を作成して、以下のような内容にします。

module.exports = {
  pages: {
    index: {
      entry: "src/main.js",
      title: "タイトル",
    }
  }
}

npm run serve を使って開発中にこのファイルの変更を反映するには npm run serve の再起動が必要のようです。

上記設定ファイル中の entry は必須で、これがないと npm run serve 起動時に "entry" is required というエラーになって起動してくれませんでした。

バージョン情報:

$ npm ls vue
...
├── vue@2.6.12
...