angular.json: The Angular Workspace – part 4

Last time I covered the schematics and cli properties of the Angular Workspace file. Today I will explain the first part of the projects property.


The projects property has received a big overhaul. The new layout is much cleaner and streamlined. Configuring your Angular project has never been easier.

When a new project is generated (ng new my-new-project) two properties are added. One for your code (my-new-project) and another for your protractor tests (my-new-project-e2e).

The neat thing about the new layout is that every project, regardless of type, is laid out the same way. The configuration only diverges once you start drilling down.


The root property tells Angular where to find the project files. In this example, the files for my-new-project are in the root folder and the files for my-new-project-e2e are the e2e subfolder.


The sourceRoot property tells Angular where to find the source files. No surprises here… they are in the src subfolder.

Note: my-new-project-e2e doesn’t have a source code folder so doesn’t need a sourceRoot property.


The projectType property tells Angular whether this is an application or a library. It’s not hard to imagine how this will expand in future to support other project types.


The prefix property tells Angular which prefix to add to any components or directives its generates. The Angular Style Guide recommends that you change this value to something unique.


I have already covered the schematics property so I won’t repeat myself here. Any schematics you override at this level will only apply to this project.

next time

Next time I’ll explain the architect property. This is where project configuration starts to diverge.

<< part 3 part 5 >>

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.