import { Configuration as DevServerConfiguration } from "webpack-dev-server";
import { Configuration, NoEmitOnErrorsPlugin } from "webpack";
import commonConfig from "./webpack.common";

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


export default (
    config: Configuration
) => {
    config = commonConfig(config);

    const devServer: DevServerConfiguration = {
        port: 4000,
        historyApiFallback: true,
        open: ["/samples.html"],
        liveReload: true,
    };

    config.mode = "development";
    config.devtool = "source-map";
    config.devServer = devServer;

    const plugins = [
        new NoEmitOnErrorsPlugin(),
        new HtmlWebpackPlugin({
            filename: "../dist/samples.html",
            template: "./template.html",
            inject: "head",
            scriptLoading: "blocking"
        })
    ];

    config.plugins ? config.plugins.push(...plugins) : config.plugins = plugins;

    return config;
}