text: const path = require("path");
  const common = require("./webpack.common.js");
  const { merge } = require("webpack-merge");
  const MiniCssExtractPlugin = require("mini-css-extract-plugin");
  
  module.exports = merge(common, {
    mode: "production",
    target: "web",
    entry: { index: "./src/index.tsx" },
    output: {
      clean: true,
      filename: "[name].js",
      path: path.resolve(__dirname, "lib"),
      publicPath: "/",
      libraryTarget: "commonjs",
    },
    module: {
      rules: [
        {
          test: /\.tsx?$/,
          exclude: /node_modules/,
          loader: "ts-loader",
        },
        {
          test: /\.scss$/,
          use: [
            MiniCssExtractPlugin.loader,
            "css-loader",
            "postcss-loader",
            "sass-loader",
          ],
        },
      ],
    },
    externals: {
      // Don't bundle react or react-dom
      react: {
        commonjs: "react",
        commonjs2: "react",
        amd: "React",
        root: "React",
      },
      "react-dom": {
        commonjs: "react-dom",
        commonjs2: "react-dom",
        amd: "ReactDOM",
        root: "ReactDOM",
      },
    },
    plugins: [
      new MiniCssExtractPlugin({
        filename: "styles.css",
      }),
    ],
  });
  