Angular 9 + CLI (TypeScript) - How to stop generating .spec.ts test files

Question

I know it's kind of a bad practice, but bear with me:

I'm using Angular-CLI, particularly ng g to generate all of my classes. However, I'm not interested in any *.spec.ts test files. I know that there are two flags (--inline-template, --inline-style) to handle inline CSS and HTML instead of separated files, and for spec the --spec flag is set to true by default.

So for each run, yes, I could do ng g c foo --it --is --spec=false.

But how do I disable the creation of test files globally? Is there any default setting for it?

Rashly, I did some stuff (that didn't work), like:

ng set spec=false --global

I also tried configuring my src/tsconfig.json by filling the exclude array:

"exclude": [
    "**/*.spec.ts"
]

Brampage · Accepted Answer · 2022-09-28T12:40:44.040

For Angular 9+ (version 6+ below)

1) Copy snippet to the root of angular.json, (configures settings to all projects/globally).
2) Or copy snippet to the root of a specific project (projects.your-project-name) in angular.json (configures settings for a specific project).

"schematics": {
  "@schematics/angular:component": {
    "style": "scss",
    "skipTests": true
  },
  "@schematics/angular:class": {
    "skipTests": true
  },
  "@schematics/angular:directive": {
    "skipTests": true
  },
  "@schematics/angular:pipe": {
    "skipTests": true
  },
  "@schematics/angular:service": {
    "skipTests": true
  }
},

All configurable options per type of file Schematic Options:

"schematics": {
  "@schematics/angular:component": {
    "changeDetection": "Default",
    "entryComponent": false,
    "export": false,
    "flat": false,
    "inlineStyle": false,
    "inlineTemplate": false,
    "module": "",
    "prefix": "",
    "selector": "",
    "skipImport": false,
    "spec": true,
    "style": "css",
    "viewEncapsulation": "Emulated",
    "skipTests": "false"
  },
  "@schematics/angular:module": {
    "commonModule": true,
    "flat": false,
    "module": "",
    "routing": false,
    "routingScope": "Child"
  },
  "@schematics/angular:service": {
    "flat": true,
    "skipTests": true
  },
  "@schematics/angular:pipe": {
    "export": false,
    "flat": true,
    "module": "",
    "skipImport": false,
    "skipTests": true
  },
  "@schematics/angular:directive": {
    "export": false,
    "flat": true,
    "module": "",
    "prefix": "app",
    "selector": "",
    "skipImport": false,
    "skipTests": true
  },
  "@schematics/angular:class": {
    "skipTests": true
  }
},

For Angular 6+

1) Copy snippet to the root of angular.json, (configures settings to all projects/globally).
2) Or copy snippet to the root of a specific project (projects.your-project-name) in angular.json (configures settings for a specific project).

"schematics": {
  "@schematics/angular:component": {
    "styleext": "scss",
    "spec": false
  },
  "@schematics/angular:class": {
    "spec": false
  },
  "@schematics/angular:directive": {
    "spec": false
  },
  "@schematics/angular:guard": {
    "spec": false
  },
  "@schematics/angular:module": {
    "spec": false
  },
  "@schematics/angular:pipe": {
    "spec": false
  },
  "@schematics/angular:service": {
    "spec": false
  }
},

All configurable options per type of file (Schematic Options):

"schematics": {
  "@schematics/angular:component": {
    "changeDetection": "Default",
    "export": false,
    "flat": false,
    "inlineStyle": false,
    "inlineTemplate": false,
    "module": "",
    "prefix": "",
    "selector": "",
    "skipImport": false,
    "spec": true,
    "styleext": "css",
    "viewEncapsulation": "Emulated"
  },
  "@schematics/angular:module": {
    "commonModule": true,
    "flat": false,
    "module": "",
    "routing": false,
    "routingScope": "Child",
    "spec": true
  },
  "@schematics/angular:service": {
    "flat": true,
    "spec": true
  },
  "@schematics/angular:pipe": {
    "export": false,
    "flat": true,
    "module": "",
    "skipImport": false,
    "spec": true
  },
  "@schematics/angular:directive": {
    "export": false,
    "flat": true,
    "module": "",
    "prefix": "app",
    "selector": "",
    "skipImport": false,
    "spec": true
  },
  "@schematics/angular:class": {
    "spec": true
  }
},

Angular CLI configuration with Angular CLI

ERROR:

The ng set defaults.spec.component false command results in the error: get/set have been deprecated in favor of the config command.

ng set got changed to ng config.

Using the Angular CLI (config command usage):

The settings for generating specs, inline templates, inline styling etc. within angular.json are now persisted inside the schematics.@schematics/angular.<file-type>.<setting>.

Run ng config schematics.@schematics/angular.component.spec false to configure spec for components. This command adds the setting inside the schematics property within the angular.json file.

Angular CLI workspace file (angular.json) on Angular Github

Schematic options inside schema.json

How to do X in Angular CLI v6

score 29 · Answer 2 · answered Jun 29 '18 at 07:26

29

If you're using v6 and need to edit your angular.json

You can edit the schematics for your project.

"schematics": {
    "@schematics/angular:component": {
      "styleext": "scss",
      "spec": false
    },
    "@schematics/angular:class": {
      "spec": false
    },
    "@schematics/angular:directive": {
      "spec": false
    },
    "@schematics/angular:guard": {
      "spec": false
    },
    "@schematics/angular:module": {
      "spec": false
    },
    "@schematics/angular:pipe": {
      "spec": false
    },
    "@schematics/angular:service": {
      "spec": false
    }
  },

answered Jun 29 '18 at 07:26

Paul Story

582
4
10

1

it should be the correct answer with Angular 6. Add this code to angular.json file of the project. you should use VScode tool with "Angular Files" plugin to create service, component, module, routing... – HungNM2 Jul 03 '18 at 09:38
1

Thanks.. it works for angular 7 too. Added at the end of angular.json file – Surendranath Sonawane Apr 13 '19 at 06:08

score 24 · Answer 3 · answered Feb 05 '17 at 08:31

You can run this command to disable spec file generation for a specific type of file:

ng set defaults.spec.FILETYPE false

For example:

ng set defaults.spec.component false // Won't generate spec files for .component files

Alternately you can just disable all spec file generation from the angular-cli.json file.

{
  ...
  "defaults": {
    "spec": {
      "class": false,
      "component": false,
      "directive": false,
      "module": false,
      "pipe": false,
      "service": false
    }
  }
}

`angular-cli.json` was deprecated in favor of `angular.json`. And there's no `defaults` key in angular.json so I'm afraid this answer is outdated. — Patrick, Jan 09 '20 at 23:03

score 14 · Answer 4 · answered Feb 10 '20 at 18:54

For Angular 9+:

The Angular.json config has changed slightly which is causing previous configuration schemas to change, per this GitHub issue on Angular/CLI.

Adapted from @sacgrover's comment along with my own:

Old way

"@schematics/angular:component": {
    // true => DO generate spec files, false => DON'T generate them
    "spec": true,
    "styleext": "scss"
}

New way:

"@schematics/angular:component": {
    // true => DON'T generate spec files, false => DO generate them
    "skipTests": true,
    "style": "scss"
}

Additional Reference => Angular Docs for CLI Generate Command

Property "@schematics/angular:component" is not allowed(angular10). — Goran_Ilic_Ilke, Aug 23 '20 at 12:00

score 13 · Answer 5 · edited May 23 '17 at 12:26

Just to update Sabbir Rahman's answer:

In version 1.0.2 of the CLI you will have to set the spec file to false for each individual type. An example is included below:

"defaults": {
    "styleExt": "scss",
    "component": {
      "spec": false
    },
    "service": {
      "spec": false
    },
    "directive": {
      "spec": false
    },
    "class": {
      "spec": false // Set to false by default
    },
    "module": {
      "spec": false // Set to false by default
    },
    "pipe": {
      "spec": false
    }
  }

score 12 · Answer 6 · edited Jun 28 '19 at 09:37

12

you can add --skipTests=true|false if true it wont generate any spec.ts

example : ng g component componentName --skipTests=true

this line wont generate any spec.ts files

EDIT:

Note: As of angular 7 this command doesn't work, even though this command is mentioned on the official website of angular. Here: https://angular.io/cli/generate#component

edited Jun 28 '19 at 09:37

Community

1
1

answered Feb 15 '19 at 09:44

Sai Sundeep

273
2
7

1

didn't want to -1 your answer, but it doesn't work (I tried it with ng7)... – TheCuBeMan Mar 19 '19 at 10:31
3

Tried with angular 9 and this worked. I prefer this way instead of disabling all spec files through json. – Andrew Apr 16 '20 at 20:41

score 11 · Answer 7 · answered Apr 03 '19 at 09:36

you can add --spec=false

example

ng g c home --spec=false

log will be

CREATE src/app/home/home.component.scss (0 bytes)
CREATE src/app/home/home.component.html (23 bytes)
CREATE src/app/home/home.component.ts (262 bytes)
UPDATE src/app/app.module.ts (467 bytes)

score 9 · Answer 8 · answered Jan 21 '20 at 10:55

9

For angular 8+:

Option "spec" is deprecated: Use "skipTests" instead, so if you want to create a new component use:

ng g c my-new-component --skipTests=true

answered Jan 21 '20 at 10:55

Gie

222
3
5

this is deprecated !! – Lakshman Pilaka May 01 '20 at 12:50

Daniel Mendes · Answer 9 · 2021-10-22T17:05:01.683

7

"@schematics/angular:component": {"style": "scss","skipTests": true}

Just add "skipTests":true to your angular.json file and you'll solve the problem

edited Oct 22 '21 at 17:05

answered Oct 22 '21 at 16:54

Daniel Mendes

71
1
4

score 3 · Answer 10 · answered Jan 13 '20 at 07:28

3

you can try --skip-tests when you creating your app like below.

ng new yourProjectName --skip-tests

answered Jan 13 '20 at 07:28

Dushan

1,365
20
26

score 3 · Answer 11 · edited May 04 '21 at 15:49

3

Just do this and you should be fine:

ng generate component newFile --skip-tests

edited May 04 '21 at 15:49

Josef

2,869
2
22
23

answered May 04 '21 at 07:03

Ankit Pandey

106
4

score 2 · Answer 12 · answered Mar 29 '22 at 06:58

2

you can add --skipTests=true to stop generating spec file

Example:

ng g s core/services/auth/auth-guard --skipTests=true

log will be

CREATE src/app/core/services/auth/auth-guard.service.ts (138 bytes)

answered Mar 29 '22 at 06:58

Bhavesh Ajani

991
9
11

score 1 · Answer 13 · answered Jan 10 '20 at 10:49

1

Add Following code on Angular.json

"schematics": {
    "@schematics/angular": {
      "component": {
        "spec": false
      }
    }
  }

answered Jan 10 '20 at 10:49

Manish Vadher

1,524
15
14

score 1 · Answer 14 · answered Aug 12 '20 at 18:56

1

Just Run this command: ng config schematics.@schematics/angular.component.spec false

answered Aug 12 '20 at 18:56

Herquiloide Hele

13
3

Angular 9 + CLI (TypeScript) - How to stop generating .spec.ts test files

14 Answers14

For Angular 9+ (version 6+ below)

For Angular 6+

Angular CLI configuration with Angular CLI

For Angular 9+:

Linked