[[oktatas:web:angular|< Angular]]
====== Angular projekt készítés kapcsolói ======
* **Szerző:** Sallai András
* Copyright (c) 2022, Sallai András
* Szerkesztve: 2025
* Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC Attribution-Share Alike 4.0 International]]
* Web: https://szit.hu
===== Standalone elhagyása =====
Ha szeretnék az Angular 16-ban alapértelmezett app.module.ts állománnyal dolgozni, vagyis
kihagyni a standalone módot:
Megoldás:
ng new app01 --no-standalone
===== Minimális projekt =====
ng new --minimal --routing false app01
===== Minimális projekt létrehozása =====
A minimális projekt létrehozása
ng new app01 --minimal
==== Ami nincs ====
* teszt
* külön fájlban HTML
* külön fájlban stílus
==== Ami van ====
app01/
|-node_modules/
|-public/
|-src/
| |-app/
| | |-app.component.ts
| | |-app.config.ts
| | `-app.routes.ts
| |-index.html
| |-main.ts
| `-styles.css
|-.browserslistrc
|-.gitignore
|-angular.json
|-package-lock.json
|-package.json
|-README.md
|-tsconfig.app.json
`-tsconfig.json
===== Minimális projekt sablonnal és stíluslappal =====
Ha szeretnénk legyártani a .html és .css fájlt is:
ng new app01 --minimal --inline-style false --inline-template false
Röviden:
ng n app01 --minimal -s false -t false
A következő könyvtárszerkezetet kapjuk.
app01/
|-node_modules/
|-public/
|-src/
| |-app/
| | |-app.component.css
| | |-app.component.html
| | |-app.component.ts
| | |-app.config.ts
| | `-app.routes.ts
| |-index.html
| |-main.ts
| |-polyfills.ts
| `-styles.css
|-.gitignore
|-angular.json
|-package-lock.json
|-package.json
|-README.md
|-tsconfig.app.json
`-tsconfig.json
===== Teszt nélkül =====
Ha teszt nélkül szeretném létrehozni az Angular alkalmazást:
ng new app01 --skip-tests
Ez a viselkedés megmarad a további generálások során is, mivel bejegyzésre kerül az angular.json fájlba.
Ha létrehozok egy komponens a teszt fájl ott sem jelenik meg. Például a login komponens
létrehozása:
ng generate component login
Három állomány jelenik meg:
* login/login.component.css
* login/login.component.html
* login/login.component.ts
===== Link =====
* https://angular.io/cli/new (2022)