liveBook · Manning

Angular.json

As explained in Pro Angular 16

angular.json is the Angular workspace configuration file that defines project settings and command configurations.

angular.json is the Angular workspace configuration file. It controls project settings and command behavior, including which stylesheets enter the styles bundle and which defaults apply to development or production builds. section 9.3.2 section 9.5

Use angular.json to configure:

  • Global stylesheets through projects.example.architect.build.options.styles. section 9.3.2
  • Build inputs such as assets, the application entry point, TypeScript configuration, polyfills, and scripts. section 9.3.2
  • Default modes for ng serve and ng build, with development used for serving and production used for optimized builds. section 9.5

Adding Bootstrap to the styles bundle

Install the package, then update the nested styles setting: npm install bootstrap@5.2.3; ng config projects.example.architect.build.options.styles '["src/styles.css", "node_modules/bootstrap/dist/css/bootstrap.min.css"]'. The resulting configuration lists the application stylesheet and Bootstrap stylesheet, allowing classes such as bg-primary and text-white in a template. Use ng serve to rebuild and test the result. section 9.3.2

How Pro Angular 16 covers it

How deep it goes
Explains nested build options and their effects, but stops short of detailing the complete workspace configuration schema.
Examples
Demonstrates querying and editing styles with ng config, integrating Bootstrap, inspecting bundles, and running ng serve or ng build.
What it assumes
Assumes an existing Angular workspace and basic use of npm and Angular CLI commands.
What you can do after
Operate/configure Angular CLI builds and manually add stylesheet packages that lack schematics support.
How it connects
Connects Angular CLI commands with stylesheets, bundling, production builds, ahead-of-time compilation, and the schematics API.
Cover of Pro Angular 16
liveBookmanning.com
Read Pro Angular 16 on liveBook Get the book at manning.com

Also explained in

Compare how 2 books explain angular.json →

Related concepts

This explainer was generated by Manning's knowledge graph from the text of Pro Angular 16. The section links point to the parts of the book it draws on.