fix(plugin-webpack): preload race condition

packages/plugin/webpack/src/Config.ts

@@ -121,6 +121,10 @@ export interface WebpackPluginRendererConfig {
   entryPoints: WebpackPluginEntryPoint[];
 }
 
+export interface EntryPointPluginConfig {
+  name: string;
+}
+
 export interface WebpackPluginConfig {
   /**
    * The webpack config for your main process

packages/plugin/webpack/src/WebpackConfig.ts

@@ -7,6 +7,7 @@ import { merge as webpackMerge } from 'webpack-merge';
 
 import { WebpackPluginConfig, WebpackPluginEntryPoint, WebpackPluginEntryPointLocalWindow, WebpackPluginEntryPointPreloadOnly } from './Config';
 import AssetRelocatorPatch from './util/AssetRelocatorPatch';
+import EntryPointPreloadPlugin from './util/EntryPointPreloadPlugin';
 import processConfig from './util/processConfig';
 import { isLocalOrNoWindowEntries, isLocalWindow, isNoWindow, isPreloadOnly, isPreloadOnlyEntries } from './util/rendererTypeUtils';
 
@@ -304,7 +305,10 @@ export default class WebpackConfigGenerator {
         globalObject: 'self',
         ...(this.isProd ? {} : { publicPath: '/' }),
       },
-      plugins: target === RendererTarget.ElectronPreload ? [] : [new webpack.ExternalsPlugin('commonjs2', externals)],
+      plugins: [
+        new EntryPointPreloadPlugin({ name: `entry-point-preload-${target}` }),
+        ...(target !== RendererTarget.ElectronPreload ? [] : [new webpack.ExternalsPlugin('commonjs2', externals)]),
+      ],
     };
     return webpackMerge(baseConfig, rendererConfig || {}, config);
   }

packages/plugin/webpack/src/WebpackPlugin.ts

@@ -14,6 +14,7 @@ import { merge } from 'webpack-merge';
 
 import { WebpackPluginConfig } from './Config';
 import ElectronForgeLoggingPlugin from './util/ElectronForgeLogging';
+import EntryPointPreloadPlugin from './util/EntryPointPreloadPlugin';
 import once from './util/once';
 import WebpackConfigGenerator from './WebpackConfig';
 
@@ -283,25 +284,54 @@ the generated files). Instead, it is ${JSON.stringify(pj.main)}`);
   };
 
   launchRendererDevServers = async (logger: Logger): Promise<void> => {
-    const config = await this.configGenerator.getRendererConfig(this.config.renderer.entryPoints);
-    if (config.length === 0) {
+    const configs = await this.configGenerator.getRendererConfig(this.config.renderer.entryPoints);
+    if (configs.length === 0) {
       return;
     }
 
-    for (const entryConfig of config) {
+    const preloadPlugins: string[] = [];
+    let preloadEntriesWithConfig = 0;
+    for (const entryConfig of configs) {
       if (!entryConfig.plugins) entryConfig.plugins = [];
       entryConfig.plugins.push(new ElectronForgeLoggingPlugin(logger.createTab(`Renderer Target Bundle (${entryConfig.target})`)));
 
+      const filename = entryConfig.output?.filename as string;
+      if (filename.endsWith('preload.js')) {
+        let name = `entry-point-preload-${entryConfig.target}`;
+        if (preloadPlugins.includes(name)) {
+          name = `${name}-${++preloadEntriesWithConfig}`;
+        }
+        entryConfig.plugins.push(new EntryPointPreloadPlugin({ name }));
+        preloadPlugins.push(name);
+      }
+
       entryConfig.infrastructureLogging = {
         level: 'none',
       };
       entryConfig.stats = 'none';
     }
 
-    const compiler = webpack(config);
+    const compiler = webpack(configs);
+
+    const promises = [];
+    for (const preloadPlugin of preloadPlugins) {
+      promises.push(
+        new Promise((resolve, reject) => {
+          compiler.hooks.done.tap(preloadPlugin, (stats) => {
+            if (stats.hasErrors()) {
+              // TODO(georgexu99): add a way to identify preload entries with the same target name ex) preload config entries
+              return reject(new Error(`Compilation errors in the preload: ${stats.toString()}`));
+            }
+            return resolve(undefined);
+          });
+        })
+      );
+    }
     const webpackDevServer = new WebpackDevServer(this.devServerOptions(), compiler);
     await webpackDevServer.start();
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     this.servers.push(webpackDevServer.server!);
+    await Promise.all(promises);
   };
 
   devServerOptions(): WebpackDevServer.Configuration {

packages/plugin/webpack/src/util/EntryPointPreloadPlugin.ts

@@ -0,0 +1,10 @@
+import { PluginBase } from '@electron-forge/plugin-base';
+
+import { EntryPointPluginConfig } from '../Config';
+
+export default class EntryPointPreloadPlugin extends PluginBase<EntryPointPluginConfig> {
+  name = this.config.name;
+  apply() {
+    // noop
+  }
+}