const path = require("path");
const { CleanWebpackPlugin } = require("clean-webpack-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const CopyWebpackPlugin = require("copy-webpack-plugin");
const Dotenv = require('dotenv-webpack');

module.exports = {
    target: "web",
    module: {
        rules: [
            {
                exclude: [/node_modules/],
                test: /\.ts$/,
                loader: "ts-loader",
                options: { configFile: "tsconfig.web.json" },
            },
            {
                test: /\.(css|scss)$/,
                loader: "css-loader!sass-loader",
            },
        ],
    },
    output: {
        filename: "bundle.[name].js",
        path: path.resolve(__dirname, "dist", "web"),
    },
    resolve: {
        extensions: [".ts", ".js"],
        alias: {
            react: path.resolve(__dirname, "src/wrapper/apollo.js")
        },
    },
    plugins: [
        new CleanWebpackPlugin(),
        new HtmlWebpackPlugin({ template: './src/index.ejs' }),
        new CopyWebpackPlugin([
            './node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js',
            { from: './node_modules/@webcomponents/webcomponentsjs/bundles', to: 'bundles' },
        ]),
        new Dotenv(),
    ],
};