Setting app icon in electron using electron forge and react ( typescript ) stack

Question

I've setup an electron app with TS+Webpack and React TS

I'm trying to change the app icon.

I have the following folder structure for the app

src
    ├───main
    │   ├───assets
    │   ├───methods
    │   └───types
    |   index.ts
    |   preload.ts
    ├───renderer
    │   ├───assets
    │   ├───components
    │   ├───context
    │   ├───helpers
    │   ├───layout
    │   ├───mui
    │   ├───router
    │   └───views
    └───typings

the icon is placed in src/main/assets folder, inside the index.ts ( main process file ) I've added

const mainWindow = new BrowserWindow({
    height: 800,
    width: 1200,
    icon: path.join(__dirname, 'assets/64x64.png'),
})

but this doesn't seem to work.

Other than that, I have the following webpack config in webpack.rules.js for image files, which is used to import image files in the renderer.

  {
    test: /\.(png|jpe?g|gif|jp2|webp)$/,
    loader: 'file-loader',
    options: {
      name: 'images/[name].[ext]'
    }
  }