@schematics/angular
Advanced tools
The @schematics/angular package is a collection of schematics for generating and modifying Angular applications and libraries. Schematics are templates that support complex logic, allowing developers to automate the creation of common patterns and best practices in an Angular project. This package is primarily used with the Angular CLI to scaffold various parts of an Angular application, such as components, services, modules, and more.
Generating Components
This command uses @schematics/angular to generate a new component named 'my-new-component'. It creates a new directory with the component's TypeScript, HTML, CSS, and spec files.
ng generate component my-new-componentGenerating Services
This command generates a new service named 'my-new-service'. It creates a TypeScript file for the service, equipped with the @Injectable decorator, allowing it to be injected as a dependency in other classes.
ng generate service my-new-serviceGenerating Modules
Generates a new NgModule named 'my-module'. This is useful for organizing related components, services, directives, and pipes into cohesive blocks of functionality.
ng generate module my-moduleSimilar to @schematics/angular, @ngrx/schematics provides schematics for generating and modifying parts of Angular applications, but it is focused on state management features using NgRx. It offers schematics for actions, reducers, effects, and more, facilitating the setup and development of reactive state management patterns.
While @angular/material primarily provides Angular components that implement Google's Material Design, it also includes schematics for adding and configuring Angular Material in an Angular project. These schematics can generate pre-configured navigation, dashboards, and tables, showcasing how it extends the Angular CLI's capabilities in a similar manner to @schematics/angular but with a focus on UI components.
This project was generated with Angular CLI version <%= version %>.
Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.
Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.
Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the --prod flag for a production build.
Run ng test to execute the unit tests via Karma.
Run ng e2e to execute the end-to-end tests via Protractor.
To get more help on the Angular CLI use ng help or go check out the Angular CLI README.
17.0.7 (2023-12-13)
| Commit | Type | Description |
| --------------------------------------------------------------------------------------------------- | ---- | ------------------------------------------------------------------------------------------------ |
| 3df3e583c | fix | baseHref with trailing slash causes server not to be accessible without trailing slash |
| ef1178188 | fix | allow vite to serve JavaScript and TypeScript assets |
| 385eb77d2 | fix | cache loading of component resources in JIT mode |
| 4b3af73ac | fix | ensure browser-esbuild is used in dev server with browser builder and forceEsbuild |
| d1b27e53e | fix | ensure port 0 uses random port with Vite development server |
| f2f7d7c70 | fix | file is missing from the TypeScript compilation with JIT |
| 7b8d6cddd | fix | handle updates of an npm link library from another workspace when preserveSymlinks is true |
| c08c78cb8 | fix | inlining of fonts results in jagged fonts for Windows users |
| 930024811 | fix | retain symlinks to output platform directories on builds |
| 3623fe911 | fix | update ESM loader to work with Node.js 18.19.0 |
<a name="17.0.6"></a>
FAQs
Schematics specific to Angular
We found that @schematics/angular demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
A malicious npm package disguised as a WhatsApp client is exploiting authentication flows with a remote kill switch to exfiltrate data and destroy files.
Security News
PyPI now supports digital attestations, enhancing security and trust by allowing package maintainers to verify the authenticity of Python packages.
Security News
GitHub removed 27 malicious pull requests attempting to inject harmful code across multiple open source repositories, in another round of low-effort attacks.