node_modules directory is empty in packaged app when using @electron-forge/plugin-webpack

Question

In an electron application im using the @electron-forge/plugin-webpack plugin. Here is my forge.config.js file.

  module.exports = {
    rebuildConfig: {},
    publishers: [
        {
            name: '@electron-forge/publisher-github',
            config: {
                repository: {
                    owner: '...',
                    name: '...'
                },
            }
        }
    ],
    makers: [
        {
            name: '@electron-forge/maker-squirrel',
            config: {},
        },
        {
            name: '@electron-forge/maker-zip',
            platforms: ['darwin'],
        },
        {
            name: '@electron-forge/maker-deb'
            config: {},
        },
        {
            name: '@electron-forge/maker-rpm',
            config: {},
        },
    ],
    // comment the block below inorder to copy the node_modules to the output when packaging
    plugins: [
        {
            name: '@electron-forge/plugin-webpack',
            config: {
                mainConfig: './webpack.main.config.js',
                devContentSecurityPolicy: "connect-src 'self' * 'unsafe-eval'",
                renderer: {
                    config: './webpack.renderer.config.js',
                    entryPoints: [
                        {
                            html: './src/public/home.html',
                            js: './src/renderer.js',
                            name: 'main_window',
                            preload: {
                                js: './src/preload.js'
                            },
                        },
                    ],
                },
            },
        },
    ],
};

when i run npm run package the out/<app>/resources/app/node_modules directory is empty. However if I remove the plugin section, then node_modules are copied correctly. But i cant comment the plugin section as webpack is needed.

Am I configuring anything wrong or missing something?

Answer 1

I could't find what is the issue (or it is the expected behaviour) with the configuration. But as a workaround i used forge hooks.

forge.config.js

const fs = require('fs');
const path = require('path');
const {exec} = require('child_process');
module.exports = {
   ...
    hooks: {
        postPackage: async (forgeConfig, options) => {
            const srcNodeModules = path.join(__dirname, 'node_modules')
            const output =  path.join(__dirname, `out/myapp-${process.platform}-${process.arch}/resources/app`)
            const destNodeModules =  path.join(output, 'node_modules')
            fs.cpSync( srcNodeModules, destNodeModules, {recursive: true});
            exec(`npm --prefix ${output} prune --production`)
        }
    }
}

Answer 2

In my case I was able to solve this problem by defining a custom ignore list in my forge config file.

module.exports = {
  ...
  packagerConfig: {
    ignore: [
      /^\/(src|test|out)/,
      /^\/node_modules\/electron($|\/)/,
      /^\/node_modules\/\.bin($|\/)/,
      /^\/node_modules\/\.cache($|\/)/,
      /^\/node_modules\/debug($|\/)/,
      /^\/node_modules\/electron-debug($|\/)/,
      /^\/node_modules\/electron-devtools-installer($|\/)/,
      /^\/node_modules\/electron-edge-js($|\/)/,
      /^\/node_modules\/electron-packager($|\/)/,
      /^\/node_modules\/electron-winstaller($|\/)/,
      /^\/node_modules\/\.pnp($|\/)/,
      /^\/node_modules\/\.s?css-cache($|\/)/,
      /^\/node_modules\/\.shrinkwrap.yaml$/,
    ],
  },
  ...
};