Webpack sideEffects wont remove unused function

Question

In the babel-loader iam declaring side-effects to false which means that any unused function should me removed from the bundle. But in my case logFour function remains.

util.js

export function logThree() {
  console.log(3);
}
export function logFour() {
  console.log(4);
}

logThree();

logFour();

index.js

 import { logThree } from "./util";
logThree();

bundle.js

(() => {
  "use strict";
  function o() {
    console.log(3);
  }
  o(), console.log(4), o();
})();

webpack

module.exports = {
  mode: "production",
  entry: ["./src/index"],
  devtool: "source-map",
  output: {
    path: path.resolve("dist/"),
    publicPath: "/public/assets/",
    filename: "main.js",
  },
  optimization: {
    usedExports: true,
  },
  devServer: {
    contentBase: "./src",
  },
  resolve: {
    extensions: [".js"],
  },
  module: {
    rules: [
      {
        test: /\.m?js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader",
        },
        sideEffects: false,
      },
    ],
  },
};

Answer 1

First, there is no such option sideEffects: false inside webpack config. You should put it in package.json.

Second, based on your probably copy-pasted bundle.js, since it's not minimized I suspect you didn't run webpack with this flag --mode production. So no removal.