Webpack: npm startすると、distフォルダの中にさらにdistフォルダが生成される

Webpackでファイルをセットアップしようとしています。
下記のconfigファイルでnpm start を実行すると、どうしても既存のdistフォルダの中にさらにdistフォルダが生成され、その中にindex.htmlが作られてしまいます。パスの指定が間違えているのでしょうか。

また、 Entrypoint undefined = dist/index.html とも表示されるのですが、html-webpack-plugin の方にも、Entrypointなるものを設定する必要があるのでしょうか。

ファイル構成です。

dist
┗ app.bundle.js
┗ index.html
node_modules
src
┗ scripts
┗ app.js
┗ index.html (template)
webpack.config.js
package.json

const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin');
const webpack = require('webpack')

module.exports = {
    entry: path.resolve(__dirname, "app.js"),
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: "app.bundle.js"
    },
    module: {
        rules: [
            { 
                test: /.css$/, 
                use: ['style-loader','css-loader']
            }
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            hash: true,
            title: 'My Awesome application',
            myPageHeader: 'Hello World',
            template: './src/index.html',
            filename: './dist/index.html'
        })
    ]
}