import path from "path";
import MiniCssExtractPlugin from "mini-css-extract-plugin";
import CopyWebpackPlugin from "copy-webpack-plugin";
import ESLintPlugin from "eslint-webpack-plugin";


export default {
  target: "web",
  node: {
    __dirname: true
  },
  performance: {
    hints: false,
    maxEntrypointSize: 512000,
    maxAssetSize: 512000,
  },
  devtool: "cheap-module-source-map",
  entry: {
    SEQTA: "./src/SEQTA.js",
    background: "./src/background.js",
    "inject/documentload": "./src/inject/documentload.css", // Entry for CSS
    "inject/iframe": "./src/inject/iframe.css", // Entry for CSS
    "inject/injected": "./src/inject/injected.css", // Entry for CSS
  },
  output: {
    filename: (pathData) => {
      const name = pathData.chunk.name.replace("inject-", "");
      return name.includes("inject") ? `inject/${name}.js` : `${name}.js`;
    },
    // eslint-disable-next-line no-undef
    path: path.resolve("build"),
    publicPath: "",
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [
          MiniCssExtractPlugin.loader,
          {
            loader: "css-loader",
            options: {
              importLoaders: 1
            }
          }
        ]
      },
      {
        test: /\.(png|svg|jpg|jpeg|gif)$/i,
        type: "asset/resource",
        generator: {
          filename: "src/[path][name][ext]",
        },
      },
    ],
  },
  plugins: [
    new ESLintPlugin(),
    new MiniCssExtractPlugin({
      filename: "[name].css" 
    }),
    new CopyWebpackPlugin({
      patterns: [
        { from: "public", to: "." },
        { from: "src/inject/preview", to: "inject/preview" },
        { from: "node_modules/webextension-polyfill/dist/browser-polyfill.js", to: "."},
      ],
    }),
  ],
};