feat(angular): support angular v17 (#19689)

nrwl · Nov 7, 2023 · 25d6ec3 · 25d6ec3 · vercel · Nov 7, 2023
1 parent 0197444
commit 25d6ec3
Show file tree

Hide file tree

Showing 255 changed files with 8,705 additions and 5,584 deletions.
diff --git a/docs/generated/cli/create-nx-workspace.md b/docs/generated/cli/create-nx-workspace.md
@@ -145,6 +145,8 @@ Customizes the initial content of your workspace. Default presets include: ["app
 
 Type: `boolean`
 
+Default: `true`
+
 Add a routing setup for an Angular app
 
 ### skipGit
@@ -155,10 +157,18 @@ Default: `false`
 
 Skip initializing a git repository
 
+### ssr
+
+Type: `boolean`
+
+Enable Server-Side Rendering (SSR) and Static Site Generation (SSG/Prerendering) for the Angular application
+
 ### standaloneApi
 
 Type: `boolean`
 
+Default: `true`
+
 Use Standalone Components if generating an Angular app
 
 ### style

diff --git a/docs/generated/packages/angular/executors/browser-esbuild.json b/docs/generated/packages/angular/executors/browser-esbuild.json
@@ -245,7 +245,7 @@
       },
       "outputPath": {
         "type": "string",
-        "description": "The full path for the new output directory, relative to the current workspace.\nBy default, writes output to a folder named dist/ in the current project."
+        "description": "The full path for the new output directory, relative to the current workspace."
       },
       "resourcesOutputPath": {
         "type": "string",
@@ -292,12 +292,12 @@
       },
       "vendorChunk": {
         "type": "boolean",
-        "description": "Generate a seperate bundle containing only vendor libraries. This option should only be used for development to reduce the incremental compilation time.",
+        "description": "Generate a separate bundle containing only vendor libraries. This option should only be used for development to reduce the incremental compilation time.",
         "default": false
       },
       "commonChunk": {
         "type": "boolean",
-        "description": "Generate a seperate bundle containing code used across multiple bundles.",
+        "description": "Generate a separate bundle containing code used across multiple bundles.",
         "default": true
       },
       "baseHref": {
@@ -426,6 +426,7 @@
           },
           {
             "const": false,
+            "type": "boolean",
             "description": "Does not generate an `index.html` file."
           }
         ]
@@ -503,7 +504,7 @@
         "enum": ["none", "anonymous", "use-credentials"]
       },
       "allowedCommonJsDependencies": {
-        "description": "A list of CommonJS packages that are allowed to be used without a build time warning.",
+        "description": "A list of CommonJS or AMD packages that are allowed to be used without a build time warning. Use `'*'` to allow all.",
         "type": "array",
         "items": { "type": "string" },
         "default": []

diff --git a/docs/generated/packages/angular/executors/module-federation-dev-server.json b/docs/generated/packages/angular/executors/module-federation-dev-server.json
@@ -9,12 +9,18 @@
     "description": "The module-federation-dev-server executor is reserved exclusively for use with host Module Federation applications. It allows the user to specify which remote applications should be served with the host.",
     "type": "object",
     "presets": [
-      { "name": "Using a Different Port", "keys": ["browserTarget", "port"] }
+      { "name": "Using a Different Port", "keys": ["buildTarget", "port"] }
     ],
     "properties": {
       "browserTarget": {
         "type": "string",
-        "description": "A browser builder target to serve in the format of `project:target[:configuration]`. You can also pass in more than one configuration name as a comma-separated list. Example: `project:target:production,staging`.",
+        "description": "A browser builder target to serve in the format of `project:target[:configuration]`.",
+        "pattern": "^[^:\\s]+:[^:\\s]+(:[^\\s]+)?$",
+        "x-deprecated": "Use 'buildTarget' instead. It will be removed in Nx v18."
+      },
+      "buildTarget": {
+        "type": "string",
+        "description": "A build builder target to serve in the format of `project:target[:configuration]`.",
         "pattern": "^[^:\\s]+:[^:\\s]+(:[^\\s]+)?$"
       },
       "port": {
@@ -129,8 +135,11 @@
       }
     },
     "additionalProperties": false,
-    "required": ["browserTarget"],
-    "examplesFile": "## Examples\n\n{% tabs %}\n\n{% tab label=\"Basic Usage\" %}\nThe Module Federation Dev Server will serve a host application and find the remote applications associated with the host and serve them statically also.  \nSee an example set up of it below:\n\n```json\n{\n  \"serve\": {\n    \"executor\": \"@nx/angular:module-federation-dev-server\",\n    \"configurations\": {\n      \"production\": {\n        \"browserTarget\": \"host:build:production\"\n      },\n      \"development\": {\n        \"browserTarget\": \"host:build:development\"\n      }\n    },\n    \"defaultConfiguration\": \"development\",\n    \"options\": {\n      \"port\": 4200,\n      \"publicHost\": \"http://localhost:4200\"\n    }\n  }\n}\n```\n\n{% /tab %}\n\n{% tab label=\"Serve host with remotes that can be live reloaded\" %}\nThe Module Federation Dev Server will serve a host application and find the remote applications associated with the host and serve a set selection with live reloading enabled also.  \nSee an example set up of it below:\n\n```json\n{\n  \"serve-with-hmr-remotes\": {\n    \"executor\": \"@nx/angular:module-federation-dev-server\",\n    \"configurations\": {\n      \"production\": {\n        \"browserTarget\": \"host:build:production\"\n      },\n      \"development\": {\n        \"browserTarget\": \"host:build:development\"\n      }\n    },\n    \"defaultConfiguration\": \"development\",\n    \"options\": {\n      \"port\": 4200,\n      \"publicHost\": \"http://localhost:4200\",\n      \"devRemotes\": [\"remote1\", \"remote2\"]\n    }\n  }\n}\n```\n\n{% /tab %}\n\n{% /tabs %}\n"
+    "anyOf": [
+      { "required": ["buildTarget"] },
+      { "required": ["browserTarget"] }
+    ],
+    "examplesFile": "## Examples\n\n{% tabs %}\n\n{% tab label=\"Basic Usage\" %}\nThe Module Federation Dev Server will serve a host application and find the remote applications associated with the host and serve them statically also.  \nSee an example set up of it below:\n\n```json\n{\n  \"serve\": {\n    \"executor\": \"@nx/angular:module-federation-dev-server\",\n    \"configurations\": {\n      \"production\": {\n        \"buildTarget\": \"host:build:production\"\n      },\n      \"development\": {\n        \"buildTarget\": \"host:build:development\"\n      }\n    },\n    \"defaultConfiguration\": \"development\",\n    \"options\": {\n      \"port\": 4200,\n      \"publicHost\": \"http://localhost:4200\"\n    }\n  }\n}\n```\n\n{% /tab %}\n\n{% tab label=\"Serve host with remotes that can be live reloaded\" %}\nThe Module Federation Dev Server will serve a host application and find the remote applications associated with the host and serve a set selection with live reloading enabled also.  \nSee an example set up of it below:\n\n```json\n{\n  \"serve-with-hmr-remotes\": {\n    \"executor\": \"@nx/angular:module-federation-dev-server\",\n    \"configurations\": {\n      \"production\": {\n        \"buildTarget\": \"host:build:production\"\n      },\n      \"development\": {\n        \"buildTarget\": \"host:build:development\"\n      }\n    },\n    \"defaultConfiguration\": \"development\",\n    \"options\": {\n      \"port\": 4200,\n      \"publicHost\": \"http://localhost:4200\",\n      \"devRemotes\": [\"remote1\", \"remote2\"]\n    }\n  }\n}\n```\n\n{% /tab %}\n\n{% /tabs %}\n"
   },
   "description": "The module-federation-dev-server executor is reserved exclusively for use with host Module Federation applications. It allows the user to specify which remote applications should be served with the host.",
   "aliases": [],

diff --git a/docs/generated/packages/angular/executors/webpack-browser.json b/docs/generated/packages/angular/executors/webpack-browser.json
@@ -75,7 +75,7 @@
         "oneOf": [
           {
             "type": "array",
-            "description": "A list of polyfills to include in the build. Can be a full path for a file, relative to the current workspace or module specifier. Example: 'zone.js'. _Note: supported in Angular versions >= 15.0.0_.",
+            "description": "A list of polyfills to include in the build. Can be a full path for a file, relative to the current workspace or module specifier. Example: 'zone.js'.",
             "items": { "type": "string", "uniqueItems": true },
             "default": []
           },
@@ -137,7 +137,7 @@
                 "input": {
                   "type": "string",
                   "description": "The file to include.",
-                  "pattern": "\\.(?:css|scss|sass|less|styl)$"
+                  "pattern": "\\.(?:css|scss|sass|less)$"
                 },
                 "bundleName": {
                   "type": "string",
@@ -156,7 +156,7 @@
             {
               "type": "string",
               "description": "The file to include.",
-              "pattern": "\\.(?:css|scss|sass|less|styl)$"
+              "pattern": "\\.(?:css|scss|sass|less)$"
             }
           ]
         },
@@ -282,7 +282,7 @@
       },
       "outputPath": {
         "type": "string",
-        "description": "The full path for the new output directory, relative to the current workspace.\n\nBy default, writes output to a folder named dist/ in the current project."
+        "description": "The full path for the new output directory, relative to the current workspace."
       },
       "resourcesOutputPath": {
         "type": "string",
@@ -330,12 +330,12 @@
       },
       "vendorChunk": {
         "type": "boolean",
-        "description": "Generate a seperate bundle containing only vendor libraries. This option should only be used for development to reduce the incremental compilation time.",
+        "description": "Generate a separate bundle containing only vendor libraries. This option should only be used for development to reduce the incremental compilation time.",
         "default": false
       },
       "commonChunk": {
         "type": "boolean",
-        "description": "Generate a seperate bundle containing code used across multiple bundles.",
+        "description": "Generate a separate bundle containing code used across multiple bundles.",
         "default": true
       },
       "baseHref": {
@@ -537,7 +537,7 @@
         "enum": ["none", "anonymous", "use-credentials"]
       },
       "allowedCommonJsDependencies": {
-        "description": "A list of CommonJS packages that are allowed to be used without a build time warning.",
+        "description": "A list of CommonJS or AMD packages that are allowed to be used without a build time warning. Use `'*'` to allow all.",
         "type": "array",
         "items": { "type": "string" },
         "default": []

diff --git a/docs/generated/packages/angular/executors/webpack-dev-server.json b/docs/generated/packages/angular/executors/webpack-dev-server.json
@@ -7,15 +7,21 @@
     "$schema": "http://json-schema.org/draft-07/schema",
     "title": "Schema for Webpack Dev Server",
     "description": "The webpack-dev-server executor is very similar to the standard dev server builder provided by the Angular Devkit. It is usually used in tandem with `@nx/angular:webpack-browser` when your Angular application uses a custom webpack configuration.",
-    "examplesFile": "##### Seving an application with a custom webpack configuration\n\nThis executor should be used along with `@nx/angular:webpack-browser` to serve an application using a custom webpack configuration.\n\nYour `project.json` file should contain a `build` and `serve` target that matches the following:\n\n```json\n\"build\": {\n    \"executor\": \"@nx/angular:webpack-browser\",\n    \"options\": {\n        ...\n        \"customWebpackConfig\": {\n          \"path\": \"apps/appName/webpack.config.js\"\n        }\n    }\n},\n\"serve\": {\n    \"executor\": \"@nx/angular:webpack-dev-server\",\n    \"configurations\": {\n        \"production\": {\n            \"browserTarget\": \"appName:build:production\"\n        },\n        \"development\": {\n            \"browserTarget\": \"appName:build:development\"\n        }\n    },\n    \"defaultConfiguration\": \"development\",\n}\n```\n",
+    "examplesFile": "##### Seving an application with a custom webpack configuration\n\nThis executor should be used along with `@nx/angular:webpack-browser` to serve an application using a custom webpack configuration.\n\nYour `project.json` file should contain a `build` and `serve` target that matches the following:\n\n```json\n\"build\": {\n    \"executor\": \"@nx/angular:webpack-browser\",\n    \"options\": {\n        ...\n        \"customWebpackConfig\": {\n          \"path\": \"apps/appName/webpack.config.js\"\n        }\n    }\n},\n\"serve\": {\n    \"executor\": \"@nx/angular:webpack-dev-server\",\n    \"configurations\": {\n        \"production\": {\n            \"buildTarget\": \"appName:build:production\"\n        },\n        \"development\": {\n            \"buildTarget\": \"appName:build:development\"\n        }\n    },\n    \"defaultConfiguration\": \"development\",\n}\n```\n",
     "type": "object",
     "presets": [
-      { "name": "Using a Different Port", "keys": ["browserTarget", "port"] }
+      { "name": "Using a Different Port", "keys": ["buildTarget", "port"] }
     ],
     "properties": {
       "browserTarget": {
         "type": "string",
-        "description": "A browser builder target to serve in the format of `project:target[:configuration]`. You can also pass in more than one configuration name as a comma-separated list. Example: `project:target:production,staging`.",
+        "description": "A browser builder target to serve in the format of `project:target[:configuration]`. Ignored if `buildTarget` is set.",
+        "pattern": "^[^:\\s]+:[^:\\s]+(:[^\\s]+)?$",
+        "x-deprecated": "Use 'buildTarget' instead. It will be removed in Nx v18."
+      },
+      "buildTarget": {
+        "type": "string",
+        "description": "A build builder target to serve in the format of `project:target[:configuration]`.",
         "pattern": "^[^:\\s]+:[^:\\s]+(:[^\\s]+)?$"
       },
       "port": {
@@ -106,7 +112,10 @@
       }
     },
     "additionalProperties": false,
-    "required": ["browserTarget"]
+    "anyOf": [
+      { "required": ["buildTarget"] },
+      { "required": ["browserTarget"] }
+    ]
   },
   "description": "The `webpack-dev-server` executor is very similar to the standard `dev-server` builder provided by the Angular Devkit. It is usually used in tandem with `@nrwl/angular:webpack-browser` when your Angular application uses a custom webpack configuration.",
   "aliases": [],

diff --git a/docs/generated/packages/angular/executors/webpack-server.json b/docs/generated/packages/angular/executors/webpack-server.json
@@ -187,7 +187,7 @@
       },
       "vendorChunk": {
         "type": "boolean",
-        "description": "Generate a seperate bundle containing only vendor libraries. This option should only be used for development to reduce the incremental compilation time. _Note: supported in Angular versions >= 15.1.0_",
+        "description": "Generate a separate bundle containing only vendor libraries. This option should only be used for development to reduce the incremental compilation time. _Note: supported in Angular versions >= 15.1.0_",
         "default": false
       },
       "verbose": {
@@ -263,13 +263,6 @@
         "items": { "type": "string" },
         "default": []
       },
-      "bundleDependencies": {
-        "description": "Which external dependencies to bundle into the bundle. By default, all of node_modules will be bundled. _Note: This is only supported in Angular versions >= 14.0.0, < 15.0.0. It was removed in Angular 15._",
-        "oneOf": [
-          { "type": "boolean" },
-          { "type": "string", "enum": ["none", "all"] }
-        ]
-      },
       "statsJson": {
         "type": "boolean",
         "description": "Generates a 'stats.json' file which can be analyzed using tools such as 'webpack-bundle-analyzer'.",

diff --git a/docs/generated/packages/angular/generators/application.json b/docs/generated/packages/angular/generators/application.json
@@ -53,9 +53,8 @@
       },
       "routing": {
         "type": "boolean",
-        "description": "Generate a routing module.",
-        "default": false,
-        "x-prompt": "Would you like to configure routing for this application?",
+        "description": "Enable routing for the application.",
+        "default": true,
         "x-priority": "important"
       },
       "inlineStyle": {
@@ -152,8 +151,9 @@
         "default": false
       },
       "standalone": {
-        "description": "Generate an application that is setup to use standalone components. _Note: This is only supported in Angular versions >= 14.1.0_",
+        "description": "Generate an application that is setup to use standalone components.",
         "type": "boolean",
+        "default": true,
         "x-priority": "important"
       },
       "rootProject": {
@@ -169,10 +169,17 @@
         "default": false
       },
       "bundler": {
-        "description": "Bundler to use to build the application.",
+        "description": "Bundler to use to build the application. It defaults to `esbuild` for Angular versions >= 17.0.0. Otherwise, it defaults to `webpack`. _Note: The `esbuild` bundler is only considered stable from Angular v17._",
         "type": "string",
         "enum": ["webpack", "esbuild"],
-        "default": "webpack"
+        "x-prompt": "Which bundler do you want to use to build the application?",
+        "x-priority": "important"
+      },
+      "ssr": {
+        "description": "Creates an application with Server-Side Rendering (SSR) and Static Site Generation (SSG/Prerendering) enabled.",
+        "type": "boolean",
+        "x-prompt": "Do you want to enable Server-Side Rendering (SSR) and Static Site Generation (SSG/Prerendering)?",
+        "default": false
       }
     },
     "additionalProperties": false,

diff --git a/docs/generated/packages/angular/generators/component.json b/docs/generated/packages/angular/generators/component.json
@@ -58,9 +58,9 @@
         "alias": "t"
       },
       "standalone": {
-        "description": "Whether the generated component is standalone. _Note: This is only supported in Angular versions >= 14.1.0_.",
+        "description": "Whether the generated component is standalone.",
         "type": "boolean",
-        "default": false,
+        "default": true,
         "x-priority": "important"
       },
       "viewEncapsulation": {

diff --git a/docs/generated/packages/angular/generators/directive.json b/docs/generated/packages/angular/generators/directive.json
@@ -59,9 +59,9 @@
         "description": "The HTML selector to use for this directive."
       },
       "standalone": {
-        "description": "Whether the generated directive is standalone. _Note: This is only supported in Angular versions >= 14.1.0_.",
+        "description": "Whether the generated directive is standalone.",
         "type": "boolean",
-        "default": false
+        "default": true
       },
       "flat": {
         "type": "boolean",

diff --git a/docs/generated/packages/angular/generators/federate-module.json b/docs/generated/packages/angular/generators/federate-module.json
@@ -67,9 +67,9 @@
         "default": "cypress"
       },
       "standalone": {
-        "description": "Whether to generate the remote application with standalone components if it needs to be created. _Note: This is only supported in Angular versions >= 14.1.0_",
+        "description": "Whether to generate the remote application with standalone components if it needs to be created.",
         "type": "boolean",
-        "default": false
+        "default": true
       },
       "host": {
         "type": "string",

diff --git a/docs/generated/packages/angular/generators/host.json b/docs/generated/packages/angular/generators/host.json
@@ -162,8 +162,8 @@
       },
       "standalone": {
         "type": "boolean",
-        "description": "Whether to generate a host application that uses standalone components. _Note: This is only supported in Angular versions >= 14.1.0_",
-        "default": false
+        "description": "Whether to generate a host application that uses standalone components.",
+        "default": true
       },
       "ssr": {
         "description": "Whether to configure SSR for the host application",