Welcome to the Series

Welcome to the Angular App Development series, where we will learn the ingredients of Angular and the step by step processing of creating an Angular App - through the motto learning by doing.

Till now....

In the previous post Angular - Creating a Component, we have seen the way to create a Component through ng generate component component, and the list of files being generated by Angular along with the benefits over creating them manually.

There are 4 files being created as follows by ng generate component command.

• the main .component.ts file (xyz.component.ts) ==> xyz is the name of your component
• the HTML file (xyz.component.html)
• the CSS file (xyz.component.css)
• the Unit Testing specification file (xyz.component.spec.ts)

In this post....

Mostly we may not need the Unit Testing in the beginning stages or until we have firmed up our understanding to really start creating an App and writing the Unit Tests. There is a rescue in the same ng generate component or the short cut ng g c <componentName> in the form of an argument --spec false.

Using the '--spec false' argument

ng g c login --spec false

Here we wanted to create a component named Login (the actual class gets created will be LoginComponent) but without any Unit Test specification file. --spec false helps us to exclude the test spec file.

λ ng g c login --spec false
Option "spec" is deprecated: Use "skipTests" instead.
CREATE src/app/login/login.component.html (20 bytes)
CREATE src/app/login/login.component.ts (265 bytes)
CREATE src/app/login/login.component.css (0 bytes)
UPDATE src/app/app.module.ts (557 bytes)

If you see, the files being generated are only 3 - the .ts, .html and .css and there is no .spec.ts file created.

Note : This command is deprecated in the latest version of Angular and the command itself suggests an alternate by using skipTests as a command line argument in place of --spec false to get the same purpose.

Using the --skipTests argument

The below command shows the new component error gets created by using --skipTests argument on the command line.

λ ng generate component error --skipTests
CREATE src/app/error/error.component.html (20 bytes)
CREATE src/app/error/error.component.ts (265 bytes)
CREATE src/app/error/error.component.css (0 bytes)
UPDATE src/app/app.module.ts (697 bytes)

The error component is created with the 3 required files (.ts, .html and .css) without any Unit Test specification file. As usual, the main app.module.ts file gets updated with the details of the new component created just now.