Use m1dugh/native-sound-mixer in a electron app using webpack via electron-forge.

README.md

I wanted to run https://github.com/m1dugh/native-sound-mixer in an electron app.

Of course, since this uses a native module, you cannot use this in the main process. But for some reason it would not work in my render process, I got errors of webpack unable to find and load the module. This was due in part to the asset relocator. I had to switch back to @marshallofsound/webpack-asset-relocator-loader.

Bear in mind my config comes from a somewhat older electron config and has typescript support enabled.

webpack.main.config.js

const CopyPlugin = require("copy-webpack-plugin");
module.exports = {
    /**
     * This is the main entry point for your application, it's the first file
     * that runs in the main process.
     */
    entry: './src/main/index.ts',
    // Put your normal webpack config below here
    module: {
        rules: require('./webpack.rules'),
    },
    plugins: [
        new CopyPlugin({
            patterns: [
                {
                    from: 'node_modules/native-sound-mixer/dist/addons/linux-sound-mixer.node/linux-sound-mixer.node',
                    to: 'addons/linux-sound-mixer.node',
                },
                {
                    from: 'node_modules/native-sound-mixer/dist/addons/win-sound-mixer.node/win-sound-mixer.node',
                    to: 'addons/win-sound-mixer.node',
                },
            ]
        }),
    ],
    resolve: {
        extensions: ['.js', '.ts', '.jsx', '.tsx', '.css', '.json']
    }
};

webpack.rules.js

module.exports = [
  // Add support for native node modules
  {
    test: /\.node$/,
    use: 'node-loader',
  },
  {
    test: /\.(m?js|node)$/,
    parser: { amd: false },
    use: {
      loader: '@marshallofsound/webpack-asset-relocator-loader',
      options: {
        outputAssetBase: 'native_modules',
      },
    },
  },
  // ... rest of your config ...
];