feat(misc): handle artifact generators' path options including file…

… extensions (#29111)

<!-- 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. -->

## Current Behavior
<!-- This is the behavior we have today -->

Artifact generators don't handle consistently receiving a file extension
in the `path` option.

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

Artifact generators should handle receiving a file extension in the
`path` option. If the file extension is passed, the file path will be
treated as "complete" and used fully as provided. If the `path` provided
doesn't contain a file extension, the default extension will be appended
to it (or the one provided in a related option, e.g. `--language`,
`--js`, etc) together with the suffix for generators that use it.

## Related Issue(s)
<!-- Please link the issue being fixed so it gets closed when this is
merged. -->

Fixes #

docs/generated/packages/angular/generators/component.json

@@ -12,7 +12,7 @@
     "properties": {
       "path": {
         "type": "string",
-        "description": "The file path to the component without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the component. Relative to the current working directory.",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the component file path?"
       },
@@ -117,7 +117,7 @@
       }
     },
     "required": ["path"],
-    "examplesFile": "## Examples\n\n{% tabs %}\n{% tab label=\"Simple Component\" %}\n\nGenerate a component named `MyComponent` at `apps/my-app/src/lib/my-component/my-component.component.ts`:\n\n```bash\nnx g @nx/angular:component apps/my-app/src/lib/my-component/my-component\n```\n\n{% /tab %}\n\n{% tab label=\"With Different Symbol Name\" %}\n\nGenerate a component named `CustomComponent` at `apps/my-app/src/lib/my-component/my-component.component.ts`:\n\n```bash\nnx g @nx/angular:component apps/my-app/src/lib/my-component/my-component --name=custom\n```\n\n{% /tab %}\n\n{% tab label=\"Single File Component\" %}\n\nCreate a component named `my-component` with inline styles and inline template:\n\n```bash\nnx g @nx/angular:component apps/my-app/src/lib/my-component/my-component --inlineStyle --inlineTemplate\n```\n\n{% /tab %}\n\n{% tab label=\"Component with OnPush Change Detection Strategy\" %}\n\nCreate a component named `my-component` with OnPush Change Detection Strategy:\n\n```bash\nnx g @nx/angular:component apps/my-app/src/lib/my-component/my-component --changeDetection=OnPush\n```\n\n{% /tab %}\n",
+    "examplesFile": "## Examples\n\n{% tabs %}\n{% tab label=\"Simple Component\" %}\n\nGenerate a component named `MyComponent` at `apps/my-app/src/lib/my-component/my-component.component.ts`:\n\n```bash\nnx g @nx/angular:component apps/my-app/src/lib/my-component/my-component.ts\n```\n\n{% /tab %}\n\n{% tab label=\"Without Providing the File Extension\" %}\n\nGenerate a component named `MyComponent` at `apps/my-app/src/lib/my-component/my-component.component.ts`:\n\n```bash\nnx g @nx/angular:component apps/my-app/src/lib/my-component/my-component\n```\n\n{% /tab %}\n\n{% tab label=\"With Different Symbol Name\" %}\n\nGenerate a component named `CustomComponent` at `apps/my-app/src/lib/my-component/my-component.component.ts`:\n\n```bash\nnx g @nx/angular:component apps/my-app/src/lib/my-component/my-component --name=custom\n```\n\n{% /tab %}\n\n{% tab label=\"Single File Component\" %}\n\nCreate a component named `my-component` with inline styles and inline template:\n\n```bash\nnx g @nx/angular:component apps/my-app/src/lib/my-component/my-component --inlineStyle --inlineTemplate\n```\n\n{% /tab %}\n\n{% tab label=\"Component with OnPush Change Detection Strategy\" %}\n\nCreate a component named `my-component` with OnPush Change Detection Strategy:\n\n```bash\nnx g @nx/angular:component apps/my-app/src/lib/my-component/my-component --changeDetection=OnPush\n```\n\n{% /tab %}\n",
     "presets": []
   },
   "aliases": ["c"],

docs/generated/packages/angular/generators/directive.json

@@ -12,6 +12,10 @@
     "examples": [
       {
         "description": "Generate a directive with the exported symbol matching the file name. It results in the directive `FooDirective` at `mylib/src/lib/foo.directive.ts`",
+        "command": "nx g @nx/angular:directive mylib/src/lib/foo.directive.ts"
+      },
+      {
+        "description": "Generate a directive without providing the file extension. It results in the directive `FooDirective` at `mylib/src/lib/foo.directive.ts`",
         "command": "nx g @nx/angular:directive mylib/src/lib/foo"
       },
       {
@@ -22,7 +26,7 @@
     "properties": {
       "path": {
         "type": "string",
-        "description": "The file path to the directive without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the directive. Relative to the current working directory.",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the directive file path?"
       },

docs/generated/packages/angular/generators/pipe.json

@@ -12,6 +12,10 @@
     "examples": [
       {
         "description": "Generate a pipe with the exported symbol matching the file name. It results in the pipe `FooPipe` at `mylib/src/lib/foo.pipe.ts`",
+        "command": "nx g @nx/angular:pipe mylib/src/lib/foo.pipe.ts"
+      },
+      {
+        "description": "Generate a pipe without providing the file extension. It results in the pipe `FooPipe` at `mylib/src/lib/foo.pipe.ts`",
         "command": "nx g @nx/angular:pipe mylib/src/lib/foo"
       },
       {
@@ -22,7 +26,7 @@
     "properties": {
       "path": {
         "type": "string",
-        "description": "The file path to the pipe without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the pipe. Relative to the current working directory.",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the pipe file path?"
       },

docs/generated/packages/angular/generators/scam-directive.json

@@ -10,6 +10,10 @@
     "examples": [
       {
         "description": "Generate a directive with the exported symbol matching the file name. It results in the directive `FooDirective` at `mylib/src/lib/foo.directive.ts`",
+        "command": "nx g @nx/angular:scam-directive mylib/src/lib/foo.directive.ts"
+      },
+      {
+        "description": "Generate a directive without providing the file extension. It results in the directive `FooDirective` at `mylib/src/lib/foo.directive.ts`",
         "command": "nx g @nx/angular:scam-directive mylib/src/lib/foo"
       },
       {
@@ -22,7 +26,7 @@
     "properties": {
       "path": {
         "type": "string",
-        "description": "The file path to the SCAM directive without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the SCAM directive. Relative to the current working directory.",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the SCAM directive file path?"
       },

docs/generated/packages/angular/generators/scam-pipe.json

@@ -10,6 +10,10 @@
     "examples": [
       {
         "description": "Generate a pipe with the exported symbol matching the file name. It results in the pipe `FooPipe` at `mylib/src/lib/foo.pipe.ts`",
+        "command": "nx g @nx/angular:scam-pipe mylib/src/lib/foo.pipe.ts"
+      },
+      {
+        "description": "Generate a pipe without providing the file extension. It results in the pipe `FooPipe` at `mylib/src/lib/foo.pipe.ts`",
         "command": "nx g @nx/angular:scam-pipe mylib/src/lib/foo"
       },
       {
@@ -22,7 +26,7 @@
     "properties": {
       "path": {
         "type": "string",
-        "description": "The file path to the SCAM pipe without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the SCAM pipe. Relative to the current working directory.",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the SCAM pipe file path?"
       },

docs/generated/packages/angular/generators/scam.json

@@ -10,6 +10,10 @@
     "examples": [
       {
         "description": "Generate a component with the exported symbol matching the file name. It results in the component `FooComponent` at `mylib/src/lib/foo.component.ts`",
+        "command": "nx g @nx/angular:scam mylib/src/lib/foo.component.ts"
+      },
+      {
+        "description": "Generate a component without providing the file extension. It results in the component `FooComponent` at `mylib/src/lib/foo.component.ts`",
         "command": "nx g @nx/angular:scam mylib/src/lib/foo"
       },
       {
@@ -22,7 +26,7 @@
     "properties": {
       "path": {
         "type": "string",
-        "description": "The file path to the SCAM without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the SCAM. Relative to the current working directory.",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the SCAM file path?"
       },

docs/generated/packages/expo/generators/component.json

@@ -10,11 +10,15 @@
     "examples": [
       {
         "description": "Generate a component with the exported symbol matching the file name. It results in the component `Foo` at `mylib/src/foo.tsx`",
-        "command": "nx g @nx/expo:component mylib/src/foo"
+        "command": "nx g @nx/expo:component mylib/src/foo.tsx"
       },
       {
         "description": "Generate a component with the exported symbol different from the file name. It results in the component `Custom` at `mylib/src/foo.tsx`",
-        "command": "nx g @nx/expo:component mylib/src/foo --name=custom"
+        "command": "nx g @nx/expo:component mylib/src/foo.tsx --name=custom"
+      },
+      {
+        "description": "Generate a component without the providing the file extension. It results in the component `Foo` at `mylib/src/foo.tsx`",
+        "command": "nx g @nx/expo:component mylib/src/foo"
       },
       {
         "description": "Generate a class component at `mylib/src/foo.tsx`",
@@ -24,7 +28,7 @@
     "properties": {
       "path": {
         "type": "string",
-        "description": "The file path to the component without the file extension. Relative to the current working directory.",
+        "description": "The file path to the component. Relative to the current working directory.",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the component file path?"
       },
@@ -35,7 +39,7 @@
       "js": {
         "type": "boolean",
         "description": "Generate JavaScript files rather than TypeScript files.",
-        "default": false
+        "x-deprecated": "Provide the full file path including the file extension in the `path` option. This option will be removed in Nx v21."
       },
       "skipFormat": {
         "description": "Skip formatting files.",

docs/generated/packages/nest/generators/class.json

@@ -11,12 +11,16 @@
     "examples": [
       {
         "description": "Generate the class `Foo` at `myapp/src/app/foo.ts`",
+        "command": "nx g @nx/nest:class myapp/src/app/foo.ts"
+      },
+      {
+        "description": "Generate the class without providing the file extension. It results in the class `Foo` at `myapp/src/app/foo.ts`",
         "command": "nx g @nx/nest:class myapp/src/app/foo"
       }
     ],
     "properties": {
       "path": {
-        "description": "The file path to the class without the file extension. Relative to the current working directory.",
+        "description": "The file path to the class. Relative to the current working directory.",
         "type": "string",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the class file path?"

docs/generated/packages/nest/generators/controller.json

@@ -11,12 +11,16 @@
     "examples": [
       {
         "description": "Generate the controller `FooController` at `myapp/src/app/foo.controller.ts`",
+        "command": "nx g @nx/nest:controller myapp/src/app/foo.controller.ts"
+      },
+      {
+        "description": "Generate the controller without providing the file extension. It results in the controller `FooController` at `myapp/src/app/foo.controller.ts`",
         "command": "nx g @nx/nest:controller myapp/src/app/foo"
       }
     ],
     "properties": {
       "path": {
-        "description": "The file path to the controller without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the controller. Relative to the current working directory.",
         "type": "string",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the controller file path?"

docs/generated/packages/nest/generators/decorator.json

@@ -11,12 +11,16 @@
     "examples": [
       {
         "description": "Generate the decorator `Foo` at `myapp/src/app/foo.decorator.ts`",
+        "command": "nx g @nx/nest:decorator myapp/src/app/foo.decorator.ts"
+      },
+      {
+        "description": "Generate the decorator without providing the file extension. It results in the decorator `Foo` at `myapp/src/app/foo.decorator.ts`",
         "command": "nx g @nx/nest:decorator myapp/src/app/foo"
       }
     ],
     "properties": {
       "path": {
-        "description": "The file path to the decorator without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the decorator. Relative to the current working directory.",
         "type": "string",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the decorator file path?"

docs/generated/packages/nest/generators/filter.json

@@ -11,12 +11,16 @@
     "examples": [
       {
         "description": "Generate the filter `FooFilter` at `myapp/src/app/foo.filter.ts`",
+        "command": "nx g @nx/nest:filter myapp/src/app/foo.filter.ts"
+      },
+      {
+        "description": "Generate the filter without providing the file extension. It results in the filter `FooFilter` at `myapp/src/app/foo.filter.ts`",
         "command": "nx g @nx/nest:filter myapp/src/app/foo"
       }
     ],
     "properties": {
       "path": {
-        "description": "The file path to the filter without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the filter. Relative to the current working directory.",
         "type": "string",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the filter file path?"

docs/generated/packages/nest/generators/gateway.json

@@ -11,12 +11,16 @@
     "examples": [
       {
         "description": "Generate the gateway `FooGateway` at `myapp/src/app/foo.gateway.ts`",
+        "command": "nx g @nx/nest:gateway myapp/src/app/foo.gateway.ts"
+      },
+      {
+        "description": "Generate the gateway without providing the file extension. It results in the gateway `FooGateway` at `myapp/src/app/foo.gateway.ts`",
         "command": "nx g @nx/nest:gateway myapp/src/app/foo"
       }
     ],
     "properties": {
       "path": {
-        "description": "The file path to the gateway without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the gateway. Relative to the current working directory.",
         "type": "string",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the gateway file path?"

docs/generated/packages/nest/generators/guard.json

@@ -11,12 +11,16 @@
     "examples": [
       {
         "description": "Generate the guard `FooGuard` at `myapp/src/app/foo.guard.ts`",
+        "command": "nx g @nx/nest:guard myapp/src/app/foo.guard.ts"
+      },
+      {
+        "description": "Generate the guard without providing the file extension. It results in the guard `FooGuard` at `myapp/src/app/foo.guard.ts`",
         "command": "nx g @nx/nest:guard myapp/src/app/foo"
       }
     ],
     "properties": {
       "path": {
-        "description": "The file path to the guard without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the guard. Relative to the current working directory.",
         "type": "string",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the guard file path?"

docs/generated/packages/nest/generators/interceptor.json

@@ -11,12 +11,16 @@
     "examples": [
       {
         "description": "Generate the interceptor `FooInterceptor` at `myapp/src/app/foo.interceptor.ts`",
+        "command": "nx g @nx/nest:interceptor myapp/src/app/foo.interceptor.ts"
+      },
+      {
+        "description": "Generate the interceptor without providing the file extension. It results in the interceptor `FooInterceptor` at `myapp/src/app/foo.interceptor.ts`",
         "command": "nx g @nx/nest:interceptor myapp/src/app/foo"
       }
     ],
     "properties": {
       "path": {
-        "description": "The file path to the interceptor without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the interceptor. Relative to the current working directory.",
         "type": "string",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the interceptor file path?"

docs/generated/packages/nest/generators/interface.json

@@ -11,12 +11,16 @@
     "examples": [
       {
         "description": "Generate the interface `Foo` at `myapp/src/app/foo.interface.ts`",
+        "command": "nx g @nx/nest:interface myapp/src/app/foo.interface.ts"
+      },
+      {
+        "description": "Generate the interface without providing the file extension. It results in the interface `Foo` at `myapp/src/app/foo.interface.ts`",
         "command": "nx g @nx/nest:interface myapp/src/app/foo"
       }
     ],
     "properties": {
       "path": {
-        "description": "The file path to the interface without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the interface. Relative to the current working directory.",
         "type": "string",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the interface file path?"

docs/generated/packages/nest/generators/middleware.json

@@ -11,12 +11,16 @@
     "examples": [
       {
         "description": "Generate the middleware `FooMiddleware` at `myapp/src/app/foo.middleware.ts`",
+        "command": "nx g @nx/nest:middleware myapp/src/app/foo.middleware.ts"
+      },
+      {
+        "description": "Generate the middleware without providing the file extension. It results in the middleware `FooMiddleware` at `myapp/src/app/foo.middleware.ts`",
         "command": "nx g @nx/nest:middleware myapp/src/app/foo"
       }
     ],
     "properties": {
       "path": {
-        "description": "The file path to the middleware without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the middleware. Relative to the current working directory.",
         "type": "string",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the middleware file path?"

docs/generated/packages/nest/generators/module.json

@@ -11,12 +11,16 @@
     "examples": [
       {
         "description": "Generate the module `FooModule` at `myapp/src/app/foo.module.ts`",
+        "command": "nx g @nx/nest:module myapp/src/app/foo.module.ts"
+      },
+      {
+        "description": "Generate the module without providing the file extension. It results in the module `FooModule` at `myapp/src/app/foo.module.ts`",
         "command": "nx g @nx/nest:module myapp/src/app/foo"
       }
     ],
     "properties": {
       "path": {
-        "description": "The file path to the module without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the module. Relative to the current working directory.",
         "type": "string",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the module file path?"

docs/generated/packages/nest/generators/pipe.json

@@ -11,12 +11,16 @@
     "examples": [
       {
         "description": "Generate the pipe `FooPipe` at `myapp/src/app/foo.pipe.ts`",
+        "command": "nx g @nx/nest:pipe myapp/src/app/foo.pipe.ts"
+      },
+      {
+        "description": "Generate the pipe without providing the file extension. It results in the pipe `FooPipe` at `myapp/src/app/foo.pipe.ts`",
         "command": "nx g @nx/nest:pipe myapp/src/app/foo"
       }
     ],
     "properties": {
       "path": {
-        "description": "The file path to the pipe without the file extension and suffix. Relative to the current working directory.",
+        "description": "The file path to the pipe. Relative to the current working directory.",
         "type": "string",
         "$default": { "$source": "argv", "index": 0 },
         "x-prompt": "What is the pipe file path?"