fix(dts-plugin): dev plugin should apply after fetchPromise resolved

.changeset/tame-numbers-sneeze.md

@@ -0,0 +1,5 @@
+---
+'@module-federation/dts-plugin': patch
+---
+
+fix(dts-plugin): dev plugin should apply after fetchPromise resolved

packages/dts-plugin/src/core/lib/typeScriptCompiler.test.ts

@@ -308,9 +308,6 @@ describe('typeScriptCompiler', () => {
                       {
                         name: 'GenerateTypesPlugin.d.ts',
                       },
-                      {
-                        name: 'TypesPlugin.d.ts',
-                      },
                       {
                         name: 'utils.d.ts',
                       },

packages/dts-plugin/src/plugins/DevPlugin.ts

@@ -36,9 +36,14 @@ export class DevPlugin implements WebpackPluginInstance {
   private _devWorker?: DevWorker;
   private updateDebounceTimer: NodeJS.Timeout | null = null;
   private readonly UPDATE_DEBOUNCE_DELAY = 300;
+  fetchTypesPromise: Promise<void>;
 
-  constructor(options: moduleFederationPlugin.ModuleFederationPluginOptions) {
+  constructor(
+    options: moduleFederationPlugin.ModuleFederationPluginOptions,
+    fetchTypesPromise: Promise<void>,
+  ) {
     this._options = options;
+    this.fetchTypesPromise = fetchTypesPromise;
   }
 
   static ensureLiveReloadEntry(
@@ -260,14 +265,15 @@ export class DevPlugin implements WebpackPluginInstance {
     ) {
       remote.tsConfigPath = normalizedDtsOptions.tsConfigPath;
     }
-
-    this._devWorker = createDevWorker({
-      name,
-      remote: remote,
-      host: host,
-      extraOptions: extraOptions,
-      disableLiveReload: normalizedDev.disableHotTypesReload,
-      disableHotTypesReload: normalizedDev.disableHotTypesReload,
+    this.fetchTypesPromise.then(() => {
+      this._devWorker = createDevWorker({
+        name,
+        remote: remote,
+        host: host,
+        extraOptions: extraOptions,
+        disableLiveReload: normalizedDev.disableHotTypesReload,
+        disableHotTypesReload: normalizedDev.disableHotTypesReload,
+      });
     });
 
     this._stopWhenSIGTERMOrSIGINT();

packages/dts-plugin/src/plugins/DtsPlugin.ts

@@ -1,7 +1,11 @@
-import type { Compiler, WebpackPluginInstance } from 'webpack';
-import { type moduleFederationPlugin } from '@module-federation/sdk';
 import { DevPlugin } from './DevPlugin';
-import { TypesPlugin } from './TypesPlugin';
+import { normalizeOptions } from '@module-federation/sdk';
+import { ConsumeTypesPlugin } from './ConsumeTypesPlugin';
+import { GenerateTypesPlugin } from './GenerateTypesPlugin';
+import { isTSProject } from '../core';
+
+import { type moduleFederationPlugin } from '@module-federation/sdk';
+import type { Compiler, WebpackPluginInstance } from 'webpack';
 
 export class DtsPlugin implements WebpackPluginInstance {
   options: moduleFederationPlugin.ModuleFederationPluginOptions;
@@ -11,7 +15,49 @@ export class DtsPlugin implements WebpackPluginInstance {
 
   apply(compiler: Compiler) {
     const { options } = this;
-    new DevPlugin(options).apply(compiler);
-    new TypesPlugin(options).apply(compiler);
+
+    const defaultGenerateTypes = {
+      generateAPITypes: true,
+      compileInChildProcess: true,
+      abortOnError: false,
+      extractThirdParty: true,
+      extractRemoteTypes: true,
+    };
+    const defaultConsumeTypes = { abortOnError: false, consumeAPITypes: true };
+    const normalizedDtsOptions =
+      normalizeOptions<moduleFederationPlugin.PluginDtsOptions>(
+        isTSProject(options.dts, compiler.context),
+        {
+          generateTypes: defaultGenerateTypes,
+          consumeTypes: defaultConsumeTypes,
+          extraOptions: {},
+        },
+        'mfOptions.dts',
+      )(options.dts);
+
+    if (typeof normalizedDtsOptions !== 'object') {
+      return;
+    }
+
+    let resolve;
+
+    const fetchTypesPromise: Promise<void> = new Promise((res, rej) => {
+      resolve = res;
+    });
+
+    new DevPlugin(options, fetchTypesPromise).apply(compiler);
+
+    new GenerateTypesPlugin(
+      options,
+      normalizedDtsOptions,
+      defaultGenerateTypes,
+      fetchTypesPromise,
+    ).apply(compiler);
+    new ConsumeTypesPlugin(
+      options,
+      normalizedDtsOptions,
+      defaultConsumeTypes,
+      resolve,
+    ).apply(compiler);
   }
 }

packages/enhanced/src/wrapper/ModuleFederationPlugin.ts

@@ -1,12 +1,7 @@
-import type {
-  WebpackPluginInstance,
-  Compiler,
-  WebpackPluginFunction,
-} from 'webpack';
+import type { WebpackPluginInstance, Compiler } from 'webpack';
 import type { moduleFederationPlugin } from '@module-federation/sdk';
 import type IModuleFederationPlugin from '../lib/container/ModuleFederationPlugin';
 import type { ResourceInfo } from '@module-federation/manifest';
-import type { Falsy } from 'webpack/declarations/WebpackOptions';
 
 import { getWebpackPath } from '@module-federation/sdk/normalize-webpack-path';
 import path from 'node:path';