fix: merge conflict

Author: 9aoy

.gitignore

@@ -3,6 +3,7 @@
 *.local
 *.log*
 *.tsbuildinfo
+*.cpuprofile
 
 # Dist
 node_modules

client-src/index.ts

@@ -130,7 +130,7 @@ const getCurrentScriptSource = (): string => {
   }
 
   // Fail as there was no script to use.
-  throw new Error('[webpack-dev-server] Failed to get current script source.');
+  throw new Error('[rspack-dev-server] Failed to get current script source.');
 };
 
 const parsedResourceQuery = parseURL(__resourceQuery);

client-src/type.d.ts

@@ -18,13 +18,3 @@ declare interface CommunicationClient {
 declare interface CommunicationClientConstructor {
   new (url: string): CommunicationClient; // Defines a constructor that takes a string and returns a GreeterInstance
 }
-
-declare module 'ansi-html-community' {
-  function ansiHtmlCommunity(str: string): string;
-
-  namespace ansiHtmlCommunity {
-    function setColors(colors: Record<string, string | string[]>): void;
-  }
-
-  export = ansiHtmlCommunity;
-}

client-src/utils/log.ts

@@ -12,7 +12,7 @@ import type { LoggerOptions } from '../modules/types';
 import logger from '../modules/logger/index';
 import { LogLevel } from '../type';
 
-const name = 'webpack-dev-server';
+const name = 'rspack-dev-server';
 // default level is set on the client side, so it does not need
 // to be set by the CLI or API
 const defaultLevel = 'info';

package.json

@@ -51,7 +51,7 @@
     "client"
   ],
   "engines": {
-    "node": ">= 18.12.0"
+    "node": "^20.19.0 || >=22.12.0"
   },
   "packageManager": "pnpm@10.27.0",
   "homepage": "https://rspack.rs",
@@ -104,10 +104,8 @@
     "@types/serve-static": "^1.15.5",
     "@types/sockjs": "^0.3.36",
     "@types/ws": "^8.5.10",
-    "ansi-html-community": "^0.0.8",
     "bonjour-service": "^1.2.1",
     "chokidar": "^3.6.0",
-    "colorette": "^2.0.10",
     "compression": "^1.8.1",
     "connect-history-api-fallback": "^2.0.0",
     "express": "^4.22.1",

pnpm-lock.yaml

@@ -74,6 +74,8 @@ import type {
   Headers,
 } from './types';
 
+const { styleText } = util;
+
 export interface Configuration<
   A extends BasicApplication = ExpressApplication,
   S extends HTTPServer = HTTPServer,
@@ -186,7 +188,7 @@ class Server<
 
   constructor(options: DevServer, compiler: Compiler | MultiCompiler) {
     this.compiler = compiler;
-    this.logger = this.compiler.getInfrastructureLogger('webpack-dev-server');
+    this.logger = this.compiler.getInfrastructureLogger('rspack-dev-server');
     this.options = options as unknown as Configuration<A, S>;
     this.staticWatchers = [];
     this.listeners = [];
@@ -359,16 +361,16 @@ class Server<
     }
 
     if (!dir) {
-      return path.resolve(cwd, '.cache/webpack-dev-server');
+      return path.resolve(cwd, '.cache/rspack-dev-server');
     }
     if (process.versions.pnp === '1') {
-      return path.resolve(dir, '.pnp/.cache/webpack-dev-server');
+      return path.resolve(dir, '.pnp/.cache/rspack-dev-server');
     }
     if (process.versions.pnp === '3') {
-      return path.resolve(dir, '.yarn/.cache/webpack-dev-server');
+      return path.resolve(dir, '.yarn/.cache/rspack-dev-server');
     }
 
-    return path.resolve(dir, 'node_modules/.cache/webpack-dev-server');
+    return path.resolve(dir, 'node_modules/.cache/rspack-dev-server');
   }
 
   static isWebTarget(compiler: Compiler): boolean {
@@ -637,6 +639,12 @@ class Server<
     return (this.compiler as Compiler).options;
   }
 
+  shouldLogInfrastructureInfo() {
+    const compilerOptions = this.getCompilerOptions();
+    const { level = 'info' } = compilerOptions.infrastructureLogging || {};
+    return level === 'info' || level === 'log' || level === 'verbose';
+  }
+
   async normalizeOptions() {
     const { options } = this;
     const compilerOptions = this.getCompilerOptions();
@@ -1577,7 +1585,7 @@ class Server<
           }
 
           this.logger.info(
-            'Gracefully shutting down. To force exit, press ^C again. Please wait...',
+            'Gracefully shutting down. Press ^C again to force exit...',
           );
 
           needForceShutdown = true;
@@ -1643,13 +1651,13 @@ class Server<
   }
 
   setupHooks(): void {
-    this.compiler.hooks.invalid.tap('webpack-dev-server', () => {
+    this.compiler.hooks.invalid.tap('rspack-dev-server', () => {
       if (this.webSocketServer) {
         this.sendMessage(this.webSocketServer.clients, 'invalid');
       }
     });
     this.compiler.hooks.done.tap(
-      'webpack-dev-server',
+      'rspack-dev-server',
       (stats: Stats | MultiStats): void => {
         if (this.webSocketServer) {
           this.sendStats(this.webSocketServer.clients, this.getStats(stats));
@@ -1853,8 +1861,8 @@ class Server<
     });
 
     middlewares.push({
-      name: 'webpack-dev-server-assets',
-      path: '/webpack-dev-server',
+      name: 'rspack-dev-server-assets',
+      path: '/rspack-dev-server',
       middleware: (req: Request, res: Response, next: NextFunction) => {
         if (req.method !== 'GET' && req.method !== 'HEAD') {
           next();
@@ -2400,10 +2408,10 @@ class Server<
 
     this.bonjour = new Bonjour();
     this.bonjour?.publish({
-      name: `Webpack Dev Server ${os.hostname()}:${this.options.port}`,
+      name: `Rspack Dev Server ${os.hostname()}:${this.options.port}`,
       port: this.options.port as number,
       type,
-      subtypes: ['webpack'],
+      subtypes: ['rspack'],
       ...(this.options.bonjour as Partial<BonjourOptions>),
     });
   }
@@ -2419,43 +2427,6 @@ class Server<
   }
 
   async logStatus() {
-    const { cyan, isColorSupported, red } = require('colorette');
-
-    const getColorsOption = (compilerOptions: Compiler['options']): boolean => {
-      let colorsEnabled: boolean;
-
-      if (
-        compilerOptions.stats &&
-        typeof (compilerOptions.stats as unknown as StatsOptions).colors !==
-          'undefined'
-      ) {
-        colorsEnabled = (compilerOptions.stats as unknown as StatsOptions)
-          .colors as boolean;
-      } else {
-        colorsEnabled = isColorSupported as boolean;
-      }
-
-      return colorsEnabled;
-    };
-
-    const colors = {
-      info(useColor: boolean, msg: string): string {
-        if (useColor) {
-          return cyan(msg);
-        }
-
-        return msg;
-      },
-      error(useColor: boolean, msg: string): string {
-        if (useColor) {
-          return red(msg);
-        }
-
-        return msg;
-      },
-    };
-    const useColor = getColorsOption(this.getCompilerOptions());
-
     const server = this.server as S;
 
     if (this.options.ipc) {
@@ -2470,29 +2441,14 @@ class Server<
       const prettyPrintURL = (newHostname: string): string =>
         url.format({ protocol, hostname: newHostname, port, pathname: '/' });
 
-      let host: string | undefined;
       let localhost: string | undefined;
       let loopbackIPv4: string | undefined;
       let loopbackIPv6: string | undefined;
       let networkUrlIPv4: string | undefined;
       let networkUrlIPv6: string | undefined;
 
-      if (this.options.host) {
-        if (this.options.host === 'localhost') {
-          localhost = prettyPrintURL('localhost');
-        } else {
-          let isIP: IPv6 | ipaddr.IPv4 | null | undefined;
-
-          try {
-            isIP = ipaddr.parse(this.options.host) as IPv6 | ipaddr.IPv4;
-          } catch {
-            // Ignore
-          }
-
-          if (!isIP) {
-            host = prettyPrintURL(this.options.host);
-          }
-        }
+      if (this.options.host === 'localhost') {
+        localhost = prettyPrintURL('localhost');
       }
 
       const parsedIP = ipaddr.parse(address);
@@ -2529,40 +2485,27 @@ class Server<
         }
       }
 
-      this.logger.info('Project is running at:');
-
-      if (host) {
-        this.logger.info(`Server: ${colors.info(useColor, host)}`);
-      }
-
-      if (localhost || loopbackIPv4 || loopbackIPv6) {
-        const loopbacks = [];
-
-        if (localhost) {
-          loopbacks.push([colors.info(useColor, localhost)]);
-        }
-
-        if (loopbackIPv4) {
-          loopbacks.push([colors.info(useColor, loopbackIPv4)]);
-        }
-
-        if (loopbackIPv6) {
-          loopbacks.push([colors.info(useColor, loopbackIPv6)]);
-        }
+      const urlLogs: string[] = [];
 
-        this.logger.info(`Loopback: ${loopbacks.join(', ')}`);
+      const local = localhost || loopbackIPv4 || loopbackIPv6;
+      if (local) {
+        urlLogs.push(
+          `  ${styleText('white', '➜')}  ${styleText(['white', 'dim'], 'Local:')}    ${styleText('cyan', local)}`,
+        );
       }
 
       if (networkUrlIPv4) {
-        this.logger.info(
-          `On Your Network (IPv4): ${colors.info(useColor, networkUrlIPv4)}`,
+        urlLogs.push(
+          `  ${styleText('white', '➜')}  ${styleText(['white', 'dim'], 'Network:')}  ${styleText('cyan', networkUrlIPv4)}`,
+        );
+      } else if (networkUrlIPv6) {
+        urlLogs.push(
+          `  ${styleText('white', '➜')}  ${styleText(['white', 'dim'], 'Network:')}  ${styleText('cyan', networkUrlIPv6)}`,
         );
       }
 
-      if (networkUrlIPv6) {
-        this.logger.info(
-          `On Your Network (IPv6): ${colors.info(useColor, networkUrlIPv6)}`,
-        );
+      if (urlLogs.length && this.shouldLogInfrastructureInfo()) {
+        console.log(`${urlLogs.join('\n')}\n`);
       }
 
       if ((this.options.open as NormalizedOpen[])?.length > 0) {
@@ -2578,27 +2521,6 @@ class Server<
       }
     }
 
-    if ((this.options.static as NormalizedStatic[])?.length > 0) {
-      this.logger.info(
-        `Content not from webpack is served from '${colors.info(
-          useColor,
-          (this.options.static as NormalizedStatic[])
-            .map((staticOption) => staticOption.directory)
-            .join(', '),
-        )}' directory`,
-      );
-    }
-
-    if (this.options.historyApiFallback) {
-      this.logger.info(
-        `404s will fallback to '${colors.info(
-          useColor,
-          (this.options.historyApiFallback as ConnectHistoryApiFallbackOptions)
-            .index || '/index.html',
-        )}'`,
-      );
-    }
-
     if (this.options.bonjour) {
       const bonjourProtocol =
         (this.options.bonjour as BonjourOptions | undefined)?.type ||
@@ -2607,7 +2529,7 @@ class Server<
           : 'http';
 
       this.logger.info(
-        `Broadcasting "${bonjourProtocol}" with subtype of "webpack" via ZeroConf DNS (Bonjour)`,
+        `Broadcasting "${bonjourProtocol}" with subtype of "rspack" via ZeroConf DNS (Bonjour)`,
       );
     }
   }