| name | angular-frontend |
| description | Guidelines for creating and configuring Angular projects. Use when creating a new Angular project or when asked to configure an existing one. |
| metadata | {"author":"Rainer Stropek"} |
General Documentation
If you are creating a new Angular project, read the official angular-new-app skill first.
If you are looking for general information about Angular, read the official angular-developer skill. If it does not contain what you are looking for, search in https://angular.dev/llms.txt.
Environments
Add environment-related configuration (ng generate environments)
Playwright End-to-End Tests
We do not use Cypress for end-to-end testing. Instead, we use Playwright. Note: The angular-developer skill's e2e-testing reference covers Cypress — ignore it. This project uses Playwright exclusively. See the playwright-cli skill.
For repeatable Playwright tests, install the Playwright package in the Angular app:
- Install Playwright in the Angular app.
- Store Playwright config and tests in the Angular app under the
e2e folder.
Aspire Integration
Add a JS script build/set-env.js that updates the environment.apiBaseUrl environment setting according to the Aspire environment variables (process.env.services__webapi__https__0 || process.env.services__webapi__http__0). The script must write to both src/environments/environment.ts . Call this JS script in the package.json script before starting the Angular development server.
