Search code examples
angularangular-cli

How to generate Angular component without including the "component" word in the name?


As you may know, when executing the following Angular CLI command :

ng g c test

or its long version :

ng generate component test

Angular creates a component containing the following files :

CREATE src/app/test/test.component.css (0 bytes)
CREATE src/app/test/test.component.html (19 bytes)
CREATE src/app/test/test.component.spec.ts (612 bytes)
CREATE src/app/test/test.component.ts (267 bytes)

Is there any Angular CLI option or any Angular config that allows me to not include the "component" word in file names ?

The expected result is the following :

CREATE src/app/test/test.css (0 bytes)
CREATE src/app/test/test.html (19 bytes)
CREATE src/app/test/test.spec.ts (612 bytes)
CREATE src/app/test/test.ts (267 bytes)

Solution

  • There is a nice workaround using the --type option:

    ng g c test --type

    From the docs:

    --type Adds a developer-defined type to the filename, in the format "name.type.ts". Angular generate command

    If you don't specify a type, it will be omitted :)

    By the way this is a bad practice. From the General Naming Guidelines:

    Do follow a pattern that describes the symbol's feature then its type. The recommended pattern is feature.type.ts.