fix(@angular/build): avoid rebasing URLs with function calls

Function calls can alter the URL path, leading to issues during URL parsing.

Closes: #27688
(cherry picked from commit a82a741)

Author: alan-agius4

packages/angular/build/src/tools/sass/rebasing-importer.ts

@@ -93,6 +93,11 @@ abstract class UrlRebasingImporter implements Importer<'sync'> {
         continue;
       }
 
+      // Skip if value is value contains a function call
+      if (/#\{.+\(.+\)\}/.test(value)) {
+        continue;
+      }
+
       // Sass variable usage either starts with a `$` or contains a namespace and a `.$`
       const valueNormalized = value[0] === '$' || /^\w+\.\$/.test(value) ? `#{${value}}` : value;
       const rebasedPath =

tests/legacy-cli/e2e/tests/build/styles/bootstrap.ts

@@ -0,0 +1,22 @@
+import { writeMultipleFiles } from '../../../utils/fs';
+import { installPackage } from '../../../utils/packages';
+import { ng } from '../../../utils/process';
+import { updateJsonFile } from '../../../utils/project';
+
+export default async function () {
+  // Install bootstrap
+  await installPackage('bootstrap@5');
+
+  await writeMultipleFiles({
+    'src/styles.scss': `
+      @import 'bootstrap/scss/bootstrap';
+    `,
+  });
+
+  await updateJsonFile('angular.json', (workspaceJson) => {
+    const appArchitect = workspaceJson.projects['test-project'].architect;
+    appArchitect.build.options.styles = [{ input: 'src/styles.scss' }];
+  });
+
+  await ng('build');
+}