From f9a9f8bc1775f8a939dc53713091e3bcfdf52866 Mon Sep 17 00:00:00 2001
From: Alan Agius <17563226+alan-agius4@users.noreply.github.com>
Date: Tue, 10 Jun 2025 13:56:46 +0000
Subject: [PATCH] fix(@schematics/angular): add `less` as a devDependency when
 selected as the style preprocessor

Ensure `less` is automatically added to `devDependencies` when users choose it as the style preprocessor during application generation.

Closes #30503
---
 .../schematics/angular/application/index.ts    | 18 +++++++++++-------
 .../angular/application/index_spec.ts          | 14 ++++++++++++++
 2 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/packages/schematics/angular/application/index.ts b/packages/schematics/angular/application/index.ts
index 14c0688cf334..ce8c83b2871f 100644
--- a/packages/schematics/angular/application/index.ts
+++ b/packages/schematics/angular/application/index.ts
@@ -49,12 +49,12 @@ function addTsProjectReference(...paths: string[]) {
 }
 
 export default function (options: ApplicationOptions): Rule {
-  return async (host: Tree, context: SchematicContext) => {
+  return async (host: Tree) => {
     const { appDir, appRootSelector, componentOptions, folderName, sourceDir } =
       await getAppOptions(host, options);
 
     return chain([
-      addAppToWorkspaceFile(options, appDir, folderName),
+      addAppToWorkspaceFile(options, appDir),
       addTsProjectReference('./' + join(normalize(appDir), 'tsconfig.app.json')),
       options.skipTests || options.minimal
         ? noop()
@@ -157,6 +157,14 @@ function addDependenciesToPackageJson(options: ApplicationOptions) {
       });
     }
 
+    if (options.style === Style.Less) {
+      addPackageJsonDependency(host, {
+        type: NodeDependencyType.Dev,
+        name: 'less',
+        version: latestVersions['less'],
+      });
+    }
+
     if (!options.skipInstall) {
       context.addTask(new NodePackageInstallTask());
     }
@@ -165,11 +173,7 @@ function addDependenciesToPackageJson(options: ApplicationOptions) {
   };
 }
 
-function addAppToWorkspaceFile(
-  options: ApplicationOptions,
-  appDir: string,
-  folderName: string,
-): Rule {
+function addAppToWorkspaceFile(options: ApplicationOptions, appDir: string): Rule {
   let projectRoot = appDir;
   if (projectRoot) {
     projectRoot += '/';
diff --git a/packages/schematics/angular/application/index_spec.ts b/packages/schematics/angular/application/index_spec.ts
index 60700c9f45ff..6db8671aabb6 100644
--- a/packages/schematics/angular/application/index_spec.ts
+++ b/packages/schematics/angular/application/index_spec.ts
@@ -282,6 +282,20 @@ describe('Application Schematic', () => {
       expect(pkg.dependencies['zone.js']).toEqual(latestVersions['zone.js']);
     });
 
+    it('should add "less" to devDependencies when Less is selected as the style option', async () => {
+      const tree = await schematicRunner.runSchematic(
+        'application',
+        {
+          ...defaultOptions,
+          style: Style.Less,
+        },
+        workspaceTree,
+      );
+
+      const pkg = JSON.parse(tree.readContent('/package.json'));
+      expect(pkg.devDependencies['less']).toEqual(latestVersions['less']);
+    });
+
     it('should include zone.js if "zoneless" option is not present', async () => {
       const tree = await schematicRunner.runSchematic(
         'application',