Search code examples
angularionic-framework

"Error: Unknown argument: skip-tests" when trying to generate Angular component with Ionic CLI


When I try to generate a component without the automatically generated .spec.ts file, I get the following error:

$ ionic generate component myComponent --skip-tests
> ng generate component myComponent --skip-tests --project=app
Error: Unknown argument: skip-tests
[ERROR] Could not generate component.

I'm using the globally installed Ionic CLI version 7.2.0 and these versions:

"@angular/core": "^17.0.2",
"@ionic/angular": "^8.0.0",
"@ionic/angular-toolkit": "^11.0.1",

On a freshly installed Angular 17 project --skip-tests works just fine.

How can I generate components without the .spec.ts files?


Solution

  • Use the following command instead:

    ionic generate component myComponent --spec false
    

    It will generate the component without the .spec.ts file:

    $ ionic g c myComponent --spec false
    > ng generate component myComponent --spec=false --project=app
    CREATE src/app/my-component/my-component.component.scss (0 bytes)
    CREATE src/app/my-component/my-component.component.html (31 bytes)
    CREATE src/app/my-component/my-component.component.ts (292 bytes)
    [OK] Generated component!
    

    The [Ionic Angular Toolkit schematics][1] currently use the old way of specifying the exclusion of test files. Some time ago the Angular team changed spec: false to skipTests: true in the Angular schematics schemas, but the Ionic team has not made that same change.

    If you want to always exclude the spec files when generating components, update your angular.json like this:

    {
      "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
      "version": 1,
      "newProjectRoot": "projects",
      "projects": {
        "app": {
          "projectType": "application",
          "schematics": {
            "@ionic/angular-toolkit:page": {
              "spec": false
            },
            "@ionic/angular-toolkit:component": {
              "spec": false
            }
          },
    

    Note: if you want Ionic to not include .spec.ts files for other types of files like services, pipes or directives, you do need to use skipTests and not spec.

    For example:

    ionic generate service myService --skipTests 
    > ng generate service myService --skip-tests --project=app
    CREATE src/app/my-service.se
    

    If you want to skip all tests, your angular.json will look like this:

    {
      "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
      "version": 1,
      "newProjectRoot": "projects",
      "projects": {
        "app": {
          "projectType": "application",
          "schematics": {
            "@ionic/angular-toolkit:page": {
              "spec": false
            },
            "@ionic/angular-toolkit:component": {
              "spec": false
            },
            "@schematics/angular:directive": {
              "skipTests": true
            },
            "@schematics/angular:pipe": {
              "skipTests": true
            },
            "@schematics/angular:service": {
              "skipTests": true
            }
          },
    

    Edit May 2024

    I tried this solution in another Angular Ionic project with Ionic 8.0 and Angular 17.3 it did not work. I had to remove "@ionic/angular-toolkit:component" from the schematics altogether and use @schematics/angular:component with skipTests: true instead:

    {
      "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
      "version": 1,
      "newProjectRoot": "projects",
      "projects": {
        "app": {
          "projectType": "application",
          "schematics": {
            "@ionic/angular-toolkit:page": {
              "spec": false
            },
            "@schematics/angular:component": {
              "skipTests": true
            },
            "@schematics/angular:directive": {
              "skipTests": true
            },
            "@schematics/angular:pipe": {
              "skipTests": true
            },
            "@schematics/angular:service": {
              "skipTests": true
            }
          },
    
    
    
      [1]: https://github.com/ionic-team/angular-toolkit/blob/bad1f939c788a8804e9a39a11b4651163dc72f78/packages/schematics/component/schema.json#L50C8-L50C9