const { merge } = require('webpack-merge');
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ESLintPlugin = require('eslint-webpack-plugin');
const ProgressBarWebpackPlugin = require('progress-bar-webpack-plugin');
const common = require('./webpack.config.js');

const resolve = (url) => path.resolve(__dirname, "..", url);

module.exports = merge(common, {
    mode: 'development',
    devtool: 'inline-source-map',
    plugins: [
        new ProgressBarWebpackPlugin(),
        new ESLintPlugin({
            overrideConfigFile: resolve(".eslintrc.js"),
            context: resolve("src"),
            extensions: ['ts', 'js'],
            fix: true,
        }),
        new HtmlWebpackPlugin({
            template: './index.html',
            title: 'worker-transfer-data',
            scriptLoading: 'blocking',
        }),
    ],
    output: {
        filename: 'js/[name].[contenthash].js',
        library: 'x-draw-core',
        libraryTarget: 'umd',
    },
    devServer: {
        host: '127.0.0.1',
        port: 'auto',
        static: './',
        hot: true,
        bonjour: true,
        client: {
            progress: true,
            overlay: true,
        },
    },
});