feat(angular): remove unused tailwindConfig option from the ng-pack…

…agr executors (#28940)

<!-- Please make sure you have read the submission guidelines before
posting an PR -->
<!--
https://github.com/nrwl/nx/blob/master/CONTRIBUTING.md#-submitting-a-pr
-->

<!-- Please make sure that your commit message follows our format -->
<!-- Example: `fix(nx): must begin with lowercase` -->

<!-- If this is a particularly complex change or feature addition, you
can request a dedicated Nx release for this pull request branch. Mention
someone from the Nx team or the `@nrwl/nx-pipelines-reviewers` and they
will confirm if the PR warrants its own release for testing purposes,
and generate it for you if appropriate. -->

<!-- This is the behavior we have today -->

<!-- This is the behavior we should expect with the changes in this PR
-->

<!-- Please link the issue being fixed so it gets closed when this is
merged. -->

Fixes #

docs/generated/packages/angular/executors/ng-packagr-lite.json

@@ -10,10 +10,6 @@
     "cli": "nx",
     "type": "object",
     "presets": [
-      {
-        "name": "Buildable Library with Tailwind",
-        "keys": ["project", "tailwindConfig"]
-      },
       {
         "name": "Updating Project Dependencies for Buildable Library",
         "keys": ["project"]
@@ -39,10 +35,6 @@
       "poll": {
         "type": "number",
         "description": "Enable and define the file watching poll time period in milliseconds. _Note: this is only supported in Angular versions >= 18.0.0_."
-      },
-      "tailwindConfig": {
-        "type": "string",
-        "description": "The full path for the Tailwind configuration file, relative to the workspace root. If not provided and a `tailwind.config.js` file exists in the project or workspace root, it will be used. Otherwise, Tailwind will not be configured."
       }
     },
     "additionalProperties": false,

docs/generated/packages/angular/executors/package.json

@@ -10,13 +10,6 @@
     "cli": "nx",
     "type": "object",
     "presets": [
-      {
-        "name": "Publishable Library with Tailwind",
-        "keys": [
-          "project",
-          "tailwindConfig"
-        ]
-      },
       {
         "name": "Updating Project Dependencies for Publishable Library",
         "keys": [
@@ -44,12 +37,6 @@
       "poll": {
         "type": "number",
         "description": "Enable and define the file watching poll time period in milliseconds. _Note: this is only supported in Angular versions >= 18.0.0_."
-      },
-      "tailwindConfig": {
-        "type": "string",
-        "description": "The full path for the Tailwind configuration file, relative to the workspace root. If not provided and a `tailwind.config.js` file exists in the project or workspace root, it will be used. Otherwise, Tailwind will not be configured. _Note: starting with Angular v17, this option is no longer used and the configuration will be picked up if exists at the project or workspace root_.",
-        "x-completion-type": "file",
-        "x-completion-glob": "tailwind.config@(.js|.cjs|.mjs|.ts)"
       }
     },
     "additionalProperties": false,

docs/shared/guides/using-tailwind-css-with-angular-projects.md

@@ -423,8 +423,7 @@ to have the following targets:
   "executor": "@nx/angular:package",
   "outputs": ["{workspaceRoot}/dist/libs/lib1"],
   "options": {
-    "project": "libs/lib1/ng-package.json",
-    "tailwindConfig": "libs/lib1/tailwind.config.js"
+    "project": "libs/lib1/ng-package.json"
   },
   "configurations": {
     "production": {

packages/angular/src/executors/ng-packagr-lite/schema.json

@@ -7,10 +7,6 @@
   "cli": "nx",
   "type": "object",
   "presets": [
-    {
-      "name": "Buildable Library with Tailwind",
-      "keys": ["project", "tailwindConfig"]
-    },
     {
       "name": "Updating Project Dependencies for Buildable Library",
       "keys": ["project"]
@@ -36,10 +32,6 @@
     "poll": {
       "type": "number",
       "description": "Enable and define the file watching poll time period in milliseconds. _Note: this is only supported in Angular versions >= 18.0.0_."
-    },
-    "tailwindConfig": {
-      "type": "string",
-      "description": "The full path for the Tailwind configuration file, relative to the workspace root. If not provided and a `tailwind.config.js` file exists in the project or workspace root, it will be used. Otherwise, Tailwind will not be configured."
     }
   },
   "additionalProperties": false,

packages/angular/src/executors/package/schema.d.ts

@@ -1,6 +1,4 @@
 import type { NgPackagrBuilderOptions } from '@angular-devkit/build-angular';
 
 export interface BuildAngularLibraryExecutorOptions
-  extends NgPackagrBuilderOptions {
-  tailwindConfig?: string;
-}
+  extends NgPackagrBuilderOptions {}

packages/angular/src/executors/package/schema.json

@@ -7,10 +7,6 @@
   "cli": "nx",
   "type": "object",
   "presets": [
-    {
-      "name": "Publishable Library with Tailwind",
-      "keys": ["project", "tailwindConfig"]
-    },
     {
       "name": "Updating Project Dependencies for Publishable Library",
       "keys": ["project"]
@@ -36,12 +32,6 @@
     "poll": {
       "type": "number",
       "description": "Enable and define the file watching poll time period in milliseconds. _Note: this is only supported in Angular versions >= 18.0.0_."
-    },
-    "tailwindConfig": {
-      "type": "string",
-      "description": "The full path for the Tailwind configuration file, relative to the workspace root. If not provided and a `tailwind.config.js` file exists in the project or workspace root, it will be used. Otherwise, Tailwind will not be configured. _Note: starting with Angular v17, this option is no longer used and the configuration will be picked up if exists at the project or workspace root_.",
-      "x-completion-type": "file",
-      "x-completion-glob": "tailwind.config@(.js|.cjs|.mjs|.ts)"
     }
   },
   "additionalProperties": false,

packages/angular/src/executors/utilities/ng-packagr/tailwindcss.ts

@@ -1,51 +1,5 @@
-import { logger } from '@nx/devkit';
-import { workspaceRoot } from '@nx/devkit';
 import { existsSync } from 'fs';
-import { join, relative } from 'path';
-
-export interface TailwindSetup {
-  tailwindConfigPath: string;
-  tailwindPackagePath: string;
-}
-
-export function getTailwindSetup(
-  basePath: string,
-  tailwindConfig?: string
-): TailwindSetup | undefined {
-  let tailwindConfigPath = tailwindConfig;
-
-  if (!tailwindConfigPath) {
-    tailwindConfigPath = getTailwindConfigPath(basePath, workspaceRoot);
-  }
-
-  // Only load Tailwind CSS plugin if configuration file was found.
-  if (!tailwindConfigPath) {
-    return undefined;
-  }
-
-  let tailwindPackagePath: string | undefined;
-  try {
-    tailwindPackagePath = require.resolve('tailwindcss');
-  } catch {
-    const relativeTailwindConfigPath = relative(
-      workspaceRoot,
-      tailwindConfigPath
-    );
-    logger.warn(
-      `Tailwind CSS configuration file found (${relativeTailwindConfigPath})` +
-        ` but the 'tailwindcss' package is not installed.` +
-        ` To enable Tailwind CSS, please install the 'tailwindcss' package.`
-    );
-
-    return undefined;
-  }
-
-  if (!tailwindPackagePath) {
-    return undefined;
-  }
-
-  return { tailwindConfigPath, tailwindPackagePath };
-}
+import { join } from 'path';
 
 export function getTailwindConfigPath(
   projectRoot: string,
@@ -70,10 +24,3 @@ export function getTailwindConfigPath(
 
   return undefined;
 }
-
-export function getTailwindPostCssPlugin({
-  tailwindConfigPath,
-  tailwindPackagePath,
-}: TailwindSetup) {
-  return require(tailwindPackagePath)({ config: tailwindConfigPath });
-}

packages/angular/src/generators/library/library.spec.ts

@@ -1456,10 +1456,6 @@ describe('lib', () => {
         };
         "
       `);
-      const project = readProjectConfiguration(tree, 'my-lib');
-      expect(project.targets.build.options.tailwindConfig).toBe(
-        'my-lib/tailwind.config.js'
-      );
       const { devDependencies } = readJson(tree, 'package.json');
       expect(devDependencies['tailwindcss']).toBe(tailwindVersion);
       expect(devDependencies['postcss']).toBe(postcssVersion);

packages/angular/src/generators/setup-tailwind/lib/index.ts

@@ -1,6 +1,6 @@
-export * from './add-tailwind-config-path-to-project';
 export * from './add-tailwind-config';
 export * from './add-tailwind-required-packages';
 export * from './detect-tailwind-installed-version';
 export * from './normalize-options';
 export * from './update-application-styles';
+export * from './validate-build-target';

packages/angular/src/generators/setup-tailwind/lib/update-application-styles.ts

@@ -61,7 +61,7 @@ function findStylesEntryPoint(
 
   // then check for the specified styles in the build configuration if it exists
   const styles: Array<string | { input: string; inject: boolean }> =
-    project.targets?.[options.buildTarget].options?.styles;
+    project.targets?.[options.buildTarget]?.options?.styles;
 
   if (!styles) {
     return undefined;

packages/angular/src/generators/setup-tailwind/lib/validate-build-target.ts

@@ -0,0 +1,37 @@
+import { stripIndents, type ProjectConfiguration } from '@nx/devkit';
+import type { NormalizedGeneratorOptions } from '../schema';
+
+export function validateBuildTarget(
+  options: NormalizedGeneratorOptions,
+  project: ProjectConfiguration
+): void {
+  const buildTarget = project.targets?.[options.buildTarget];
+
+  if (!buildTarget) {
+    throw new Error(
+      stripIndents`The target "${options.buildTarget}" was not found for project "${options.project}".
+      If you are using a different build target, please provide it using the "--buildTarget" option.
+      If the project is not a buildable or publishable library, you don't need to setup TailwindCSS for it.`
+    );
+  }
+
+  const supportedLibraryExecutors = [
+    '@angular-devkit/build-angular:ng-packagr',
+    '@nx/angular:ng-packagr-lite',
+    '@nx/angular:package',
+  ];
+  if (
+    !supportedLibraryExecutors.includes(
+      project.targets[options.buildTarget].executor
+    )
+  ) {
+    throw new Error(
+      stripIndents`The build target for project "${
+        options.project
+      }" is using an unsupported executor "${buildTarget.executor}".
+      Supported executors are ${supportedLibraryExecutors
+        .map((e) => `"${e}"`)
+        .join(', ')}.`
+    );
+  }
+}

packages/angular/src/generators/setup-tailwind/setup-tailwind.library.spec.ts

@@ -78,7 +78,7 @@ describe('setupTailwind generator', () => {
       ).rejects.toThrow(
         expect.objectContaining({
           message: expect.stringContaining(
-            `The target "custom-build" was not found for project "${project}".`
+            `The provided target "custom-build" was not found for project "${project}".`
           ),
         })
       );
@@ -103,78 +103,6 @@ describe('setupTailwind generator', () => {
       );
     });
 
-    it('should throw when the tailwind config is configured in the build target and the file it points to exists', async () => {
-      const tailwindConfig = `libs/${project}/my-tailwind.config.js`;
-      let projectConfig = readProjectConfiguration(tree, project);
-      projectConfig.targets = {
-        build: {
-          executor: '@nx/angular:package',
-          options: { tailwindConfig },
-        },
-      };
-      updateProjectConfiguration(tree, project, projectConfig);
-      tree.write(tailwindConfig, '');
-
-      await expect(setupTailwindGenerator(tree, { project })).rejects.toThrow(
-        expect.objectContaining({
-          message: expect.stringContaining(
-            `The "${tailwindConfig}" file is already configured for the project "${project}". Are you sure this is the right project to set up Tailwind?`
-          ),
-        })
-      );
-    });
-
-    it('should add the tailwind config path to the "build" target by default when no build target is specified', async () => {
-      let projectConfig = readProjectConfiguration(tree, project);
-      projectConfig.targets = {
-        build: { executor: '@nx/angular:package', options: {} },
-      };
-      updateProjectConfiguration(tree, project, projectConfig);
-
-      await setupTailwindGenerator(tree, { project, skipFormat: true });
-
-      projectConfig = readProjectConfiguration(tree, project);
-      expect(projectConfig.targets.build.options.tailwindConfig).toBe(
-        `libs/${project}/tailwind.config.js`
-      );
-    });
-
-    it('should add the tailwind config path to the specified buildTarget', async () => {
-      const buildTarget = 'custom-build';
-      let projectConfig = readProjectConfiguration(tree, project);
-      projectConfig.targets = {
-        [buildTarget]: { executor: '@nx/angular:package', options: {} },
-      };
-      updateProjectConfiguration(tree, project, projectConfig);
-
-      await setupTailwindGenerator(tree, {
-        project,
-        buildTarget,
-        skipFormat: true,
-      });
-
-      projectConfig = readProjectConfiguration(tree, project);
-      expect(projectConfig.targets[buildTarget].options.tailwindConfig).toBe(
-        `libs/${project}/tailwind.config.js`
-      );
-    });
-
-    it.each(['@nx/angular:ng-packagr-lite', '@nx/angular:package'])(
-      'should add the tailwind config path when using the "%s" executor',
-      async (executor) => {
-        let projectConfig = readProjectConfiguration(tree, project);
-        projectConfig.targets = { build: { executor, options: {} } };
-        updateProjectConfiguration(tree, project, projectConfig);
-
-        await setupTailwindGenerator(tree, { project, skipFormat: true });
-
-        projectConfig = readProjectConfiguration(tree, project);
-        expect(projectConfig.targets.build.options.tailwindConfig).toBe(
-          `libs/${project}/tailwind.config.js`
-        );
-      }
-    );
-
     it('should add required packages', async () => {
       const projectConfig = readProjectConfiguration(tree, project);
       projectConfig.targets = {