feat(webpack): migrate from deprecated url.parse() to WHATWG URL API

Replace the deprecated url.parse() and url.format() methods with the modern WHATWG URL API in PostCSS CLI resources plugins to resolve security and maintainability concerns.

- Replace url.parse(inputUrl) with new URL(normalizedUrl, 'file:///')
- Replace url.format({ pathname, hash, search }) with simple string concatenation
- Replace url.resolve(deployUrl, outputUrl) with new URL(outputUrl, deployUrl).href
- Apply changes consistently across webpack, rspack, and angular-rspack packages

The deprecated url.parse() method is prone to security vulnerabilities and is not standardized. WHATWG URL API provides a modern, secure, and standardized way to parse URLs while maintaining all existing functionality.

Resolves deprecation warnings about url.parse() security implications.

Author: FrozenPandaz

packages/angular-rspack/src/lib/utils/postcss-cli-resources.ts

@@ -96,7 +96,9 @@ export default function (options?: PostcssCliResourcesOptions): Plugin {
       inputUrl = inputUrl.slice(1);
     }
 
-    const { pathname, hash, search } = url.parse(inputUrl.replace(/\\/g, '/'));
+    const normalizedUrl = inputUrl.replace(/\\/g, '/');
+    const parsedUrl = new URL(normalizedUrl, 'file:///');
+    const { pathname, hash, search } = parsedUrl;
     const resolver = (file: string, base: string) =>
       new Promise<string>((resolve, reject) => {
         loader.resolve(base, decodeURI(file), (err, result) => {
@@ -144,11 +146,11 @@ export default function (options?: PostcssCliResourcesOptions): Plugin {
 
         let outputUrl = outputPath.replace(/\\/g, '/');
         if (hash || search) {
-          outputUrl = url.format({ pathname: outputUrl, hash, search });
+          outputUrl = outputUrl + (search || '') + (hash || '');
         }
 
         if (deployUrl && !extracted) {
-          outputUrl = url.resolve(deployUrl, outputUrl);
+          outputUrl = new URL(outputUrl, deployUrl).href;
         }
 
         resourceCache.set(cacheKey, outputUrl);

packages/rspack/src/plugins/utils/plugins/postcss-cli-resources.ts

@@ -94,7 +94,9 @@ export function PostcssCliResources(options: PostcssCliResourcesOptions) {
       resourceCache.set(cacheKey, outputUrl);
       return outputUrl;
     }
-    const { pathname, hash, search } = url.parse(inputUrl.replace(/\\/g, '/'));
+    const normalizedUrl = inputUrl.replace(/\\/g, '/');
+    const parsedUrl = new URL(normalizedUrl, 'file:///');
+    const { pathname, hash, search } = parsedUrl;
     const resolver = (file: string, base: string) =>
       new Promise<boolean | string>((resolve, reject) => {
         loader.resolve(base, decodeURI(file), (err, result) => {
@@ -125,11 +127,11 @@ export function PostcssCliResources(options: PostcssCliResourcesOptions) {
         loader.emitFile(outputPath, content, undefined);
         let outputUrl = outputPath.replace(/\\/g, '/');
         if (hash || search) {
-          outputUrl = url.format({ pathname: outputUrl, hash, search });
+          outputUrl = outputUrl + (search || '') + (hash || '');
         }
         const loaderOptions: any = loader.loaders[loader.loaderIndex].options;
         if (deployUrl && loaderOptions.ident !== 'extracted') {
-          outputUrl = url.resolve(deployUrl, outputUrl);
+          outputUrl = new URL(outputUrl, deployUrl).href;
         }
         resourceCache.set(cacheKey, outputUrl);
         resolve(outputUrl);

packages/webpack/src/utils/webpack/plugins/postcss-cli-resources.ts

@@ -94,7 +94,9 @@ export function PostcssCliResources(options: PostcssCliResourcesOptions) {
       resourceCache.set(cacheKey, outputUrl);
       return outputUrl;
     }
-    const { pathname, hash, search } = url.parse(inputUrl.replace(/\\/g, '/'));
+    const normalizedUrl = inputUrl.replace(/\\/g, '/');
+    const parsedUrl = new URL(normalizedUrl, 'file:///');
+    const { pathname, hash, search } = parsedUrl;
     const resolver = (file: string, base: string) =>
       new Promise<boolean | string>((resolve, reject) => {
         loader.resolve(base, decodeURI(file), (err, result) => {
@@ -125,11 +127,11 @@ export function PostcssCliResources(options: PostcssCliResourcesOptions) {
         loader.emitFile(outputPath, content, undefined);
         let outputUrl = outputPath.replace(/\\/g, '/');
         if (hash || search) {
-          outputUrl = url.format({ pathname: outputUrl, hash, search });
+          outputUrl = outputUrl + (search || '') + (hash || '');
         }
         const loaderOptions: any = loader.loaders[loader.loaderIndex].options;
         if (deployUrl && loaderOptions.ident !== 'extracted') {
-          outputUrl = url.resolve(deployUrl, outputUrl);
+          outputUrl = new URL(outputUrl, deployUrl).href;
         }
         resourceCache.set(cacheKey, outputUrl);
         resolve(outputUrl);