feat(angular): support optional project option in ng-packagr executors and new builders (#31108)

- Update `project` option in `ng-packagr` executors to be optional
- Update a few places to support new builders from the `@angular/build`
package
- Update e2e tests to reflect changes

Author: leosvelperez

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

@@ -37,8 +37,7 @@
         "description": "Enable and define the file watching poll time period in milliseconds."
       }
     },
-    "additionalProperties": false,
-    "required": ["project"]
+    "additionalProperties": false
   },
   "description": "Builds an Angular library with support for incremental builds.\n\nThis executor is meant to be used with buildable libraries in an incremental build scenario. It is similar to the `@nx/angular:package` executor but it only produces ESM2022 bundles.",
   "aliases": [],

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

@@ -39,10 +39,7 @@
         "description": "Enable and define the file watching poll time period in milliseconds."
       }
     },
-    "additionalProperties": false,
-    "required": [
-      "project"
-    ]
+    "additionalProperties": false
   },
   "description": "Builds and packages an Angular library producing an output following the Angular Package Format (APF) to be distributed as an NPM package.\n\nThis executor is a drop-in replacement for the `@angular-devkit/build-angular:ng-packagr` and `@angular/build:ng-packagr` builders, with additional support for incremental builds.",
   "aliases": [],

e2e/angular/src/ng-add.test.ts

@@ -115,7 +115,7 @@ describe('convert Angular CLI workspace to an Nx workspace', () => {
       '.prettierrc',
       `apps/${project}/src/main.ts`,
       `apps/${project}/src/app/app.config.ts`,
-      `apps/${project}/src/app/app.component.ts`,
+      `apps/${project}/src/app/app.ts`,
       `apps/${project}/src/app/app.routes.ts`
     );
 
@@ -178,9 +178,8 @@ describe('convert Angular CLI workspace to an Nx workspace', () => {
     const projectConfig = readJson(`apps/${project}/project.json`);
     expect(projectConfig.sourceRoot).toEqual(`apps/${project}/src`);
     expect(projectConfig.targets.build).toStrictEqual({
-      executor: '@angular-devkit/build-angular:application',
+      executor: '@angular/build:application',
       options: {
-        outputPath: `dist/apps/${project}`,
         index: `apps/${project}/src/index.html`,
         browser: `apps/${project}/src/main.ts`,
         polyfills: [`zone.js`],
@@ -214,15 +213,15 @@ describe('convert Angular CLI workspace to an Nx workspace', () => {
       defaultConfiguration: 'production',
     });
     expect(projectConfig.targets.serve).toEqual({
-      executor: '@angular-devkit/build-angular:dev-server',
+      executor: '@angular/build:dev-server',
       configurations: {
         production: { buildTarget: `${project}:build:production` },
         development: { buildTarget: `${project}:build:development` },
       },
       defaultConfiguration: 'development',
     });
     expect(projectConfig.targets.test).toStrictEqual({
-      executor: '@angular-devkit/build-angular:karma',
+      executor: '@angular/build:karma',
       options: {
         polyfills: [`zone.js`, `zone.js/testing`],
         tsConfig: `apps/${project}/tsconfig.spec.json`,
@@ -249,7 +248,7 @@ describe('convert Angular CLI workspace to an Nx workspace', () => {
     });
 
     runCLI(`build ${project} --configuration production --outputHashing none`);
-    checkFilesExist(`dist/apps/${project}/browser/main.js`);
+    checkFilesExist(`dist/${project}/browser/main.js`);
   });
 
   it('should handle a workspace with cypress v9', () => {
@@ -436,7 +435,7 @@ describe('convert Angular CLI workspace to an Nx workspace', () => {
     expect(output).toContain(
       `Successfully ran target build for project ${project}`
     );
-    checkFilesExist(`dist/apps/${project}/browser/main.js`);
+    checkFilesExist(`dist/${project}/browser/main.js`);
 
     output = runCLI(`build ${project} --outputHashing none`);
     expect(output).toContain(
@@ -454,7 +453,7 @@ describe('convert Angular CLI workspace to an Nx workspace', () => {
     expect(output).toContain(
       `Successfully ran target build for project ${app1}`
     );
-    checkFilesExist(`dist/apps/${app1}/browser/main.js`);
+    checkFilesExist(`dist/${app1}/browser/main.js`);
 
     output = runCLI(`build ${app1} --outputHashing none`);
     expect(output).toContain(

e2e/nx-init/src/nx-init-angular.test.ts

@@ -85,7 +85,7 @@ describe('nx init (Angular CLI - legacy)', () => {
     expect(coldBuildOutput).toContain(
       `Successfully ran target build for project ${project}`
     );
-    checkFilesExist(`dist/apps/${project}/browser/main.js`);
+    checkFilesExist(`dist/${project}/browser/main.js`);
 
     // run build again to check is coming from cache
     const cachedBuildOutput = runCLI(`build ${project} --outputHashing none`);

e2e/release/src/release-publishable-libraries.test.ts

@@ -230,7 +230,6 @@ describe('release publishable libraries', () => {
       XXX.XXX kb fesm2022/proj-{project-name}.mjs
       XXX.XXX kb fesm2022/proj-{project-name}.mjs.map
       XXB index.d.ts
-      XXB lib/{project-name}/{project-name}.component.d.ts
       XXXB package.json
       === Tarball Details ===
       name:          @proj/{project-name}

packages/angular/src/builders/dev-server/dev-server.impl.ts

@@ -153,6 +153,7 @@ export function executeDevServerBuilder(
 
   const delegateBuilderOptions = getDelegateBuilderOptions(options);
   const isUsingWebpackBuilder = ![
+    '@angular/build:application',
     '@angular-devkit/build-angular:application',
     '@angular-devkit/build-angular:browser-esbuild',
     '@nx/angular:application',

packages/angular/src/executors/extract-i18n/extract-i18n.impl.ts

@@ -17,6 +17,7 @@ export default async function* extractI18nExecutor(
     buildTargetProjectConfiguration.targets[parsedBuildTarget.target];
 
   const isUsingEsbuildBuilder = [
+    '@angular/build:application',
     '@angular-devkit/build-angular:application',
     '@angular-devkit/build-angular:browser-esbuild',
     '@nx/angular:application',

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

@@ -34,6 +34,5 @@
       "description": "Enable and define the file watching poll time period in milliseconds."
     }
   },
-  "additionalProperties": false,
-  "required": ["project"]
+  "additionalProperties": false
 }

packages/angular/src/executors/package/package.impl.ts

@@ -55,6 +55,11 @@ export function createLibraryExecutor(
     options: BuildAngularLibraryExecutorOptions,
     context: ExecutorContext
   ) {
+    options.project ??= join(
+      context.projectsConfigurations.projects[context.projectName].root,
+      'ng-package.json'
+    );
+
     const { dependencies } = calculateProjectBuildableDependencies(
       context.taskGraph,
       context.projectGraph,

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

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