webpack4 ELIFECYCLE error?

Question

JavaScript

There is such a webpack4 config

//dependencies

const path = require('path');
const webpack = require('webpack');
const less = require('less');


//plugins

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

module.exports = {
    entry: {
        app: './src/index.js',
    } 
    output: {
        path: __dirname + '/dist'
        publicPath: '/dist',
        filename: 'js/[name].js'
    },
    devServer: {
        contentBase: './dist',
    },
    module: {
        rules: [
            {
                test: /\.html$/,
                use: [
                    {
                        loader: 'html-loader',
                    }
                ]
            },
            {
                test: /\.less$/,
                use: [
                    {
                        loader: 'style-loader'
                    },
                    {
                        loader: 'css-loader'
                    },
                    {
                        loader: 'less-loader'
                    },
                ]
            }

        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            filename: './index.html',
            template: 'src/template/index.html'
        }),
    ]
}

When run, it gives the following error:

index.js - empty
The file structure looks like this: enter image description here

What could be the problem? I think there is something wrong with the paths