fix(resource-hints): exclude hot-update files in dev mode (#6347)

Author: chenjiahan

packages/core/src/plugins/resourceHints.ts

@@ -61,7 +61,7 @@ export const pluginResourceHints = (): RsbuildPlugin => ({
       return { headTags, bodyTags };
     });
 
-    api.modifyBundlerChain((chain, { CHAIN_ID, environment }) => {
+    api.modifyBundlerChain((chain, { CHAIN_ID, environment, isDev }) => {
       const { config, htmlPaths } = environment;
 
       if (Object.keys(htmlPaths).length === 0) {
@@ -85,7 +85,12 @@ export const pluginResourceHints = (): RsbuildPlugin => ({
 
         chain
           .plugin(CHAIN_ID.PLUGIN.HTML_PREFETCH)
-          .use(HtmlResourceHintsPlugin, [options, 'prefetch', HTMLCount]);
+          .use(HtmlResourceHintsPlugin, [
+            options,
+            'prefetch',
+            HTMLCount,
+            isDev,
+          ]);
       }
 
       if (preload) {
@@ -99,7 +104,7 @@ export const pluginResourceHints = (): RsbuildPlugin => ({
 
         chain
           .plugin(CHAIN_ID.PLUGIN.HTML_PRELOAD)
-          .use(HtmlResourceHintsPlugin, [options, 'preload', HTMLCount]);
+          .use(HtmlResourceHintsPlugin, [options, 'preload', HTMLCount, isDev]);
       }
     });
   },

packages/core/src/rspack-plugins/resource-hints/HtmlResourceHintsPlugin.ts

@@ -135,6 +135,7 @@ function generateLinks(
   compilation: Compilation,
   data: HtmlRspackPlugin.BeforeAssetTagGenerationData,
   HTMLCount: number,
+  isDev: boolean,
 ): HtmlRspackPlugin.HtmlTagObject[] {
   // get all chunks
   const extractedChunks = extractChunks(compilation, options.type);
@@ -164,8 +165,13 @@ function generateLinks(
         ]),
       [],
     )
-    // source map files should always be excluded
-    .filter((file) => !file.endsWith('.map'));
+    // source map and hot-update files should always be excluded
+    .filter((file) => {
+      if (isDev && file.endsWith('.hot-update.js')) {
+        return false;
+      }
+      return !file.endsWith('.map');
+    });
 
   const uniqueFiles = new Set<string>(allFiles);
   const filteredFiles = applyFilter(
@@ -234,14 +240,18 @@ export class HtmlResourceHintsPlugin implements RspackPluginInstance {
 
   HTMLCount: number;
 
+  isDev: boolean;
+
   constructor(
     options: ResourceHintsOptions,
     type: LinkType,
     HTMLCount: number,
+    isDev: boolean,
   ) {
     this.options = { ...defaultOptions, ...options };
     this.type = type;
     this.HTMLCount = HTMLCount;
+    this.isDev = isDev;
   }
 
   apply(compiler: Compiler): void {
@@ -256,6 +266,7 @@ export class HtmlResourceHintsPlugin implements RspackPluginInstance {
           compilation,
           data,
           this.HTMLCount,
+          this.isDev,
         );
 
         return data;