1. Чтобы установить Angular дадим следующую команду:
npm install -g angular-cli@latest
Результат:
C:\angular>npm install -g angular-cli@latest
2. Теперь проверим версию:
ng --version
У меня результат такой:
C:\angular>ng --version
_ _ ____ _ ___
/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
|___/
Angular CLI: 12.2.3
Node: 12.18.1
Package Manager: npm 6.14.5
OS: win32 x64
Angular:
...
Package Version
------------------------------------------------------
@angular-devkit/architect 0.1202.3 (cli-only)
@angular-devkit/core 12.2.3 (cli-only)
@angular-devkit/schematics 12.2.3 (cli-only)
@schematics/angular 12.2.3 (cli-only)
3. Создадим проект firstapp:
ng new firstapp
Во время создания проекта Angular меня спросил про routing и bstylesheet, я выбрал по умолчанию routing=No, stylesheet=CSS:
C:\angular>ng new firstapp ? Would you like to add Angular routing? No ? Which stylesheet format would you like to use? CSS
Результат:
C:\angular>ng new firstapp ? Would you like to add Angular routing? No ? Which stylesheet format would you like to use? CSS CREATE firstapp/angular.json (3051 bytes) CREATE firstapp/package.json (1070 bytes) CREATE firstapp/README.md (1054 bytes) CREATE firstapp/tsconfig.json (783 bytes) CREATE firstapp/.editorconfig (274 bytes) CREATE firstapp/.gitignore (604 bytes) CREATE firstapp/.browserslistrc (703 bytes) CREATE firstapp/karma.conf.js (1425 bytes) CREATE firstapp/tsconfig.app.json (287 bytes) CREATE firstapp/tsconfig.spec.json (333 bytes) CREATE firstapp/src/favicon.ico (948 bytes) CREATE firstapp/src/index.html (294 bytes) CREATE firstapp/src/main.ts (372 bytes) CREATE firstapp/src/polyfills.ts (2820 bytes) CREATE firstapp/src/styles.css (80 bytes) CREATE firstapp/src/test.ts (788 bytes) CREATE firstapp/src/assets/.gitkeep (0 bytes) CREATE firstapp/src/environments/environment.prod.ts (51 bytes) CREATE firstapp/src/environments/environment.ts (658 bytes) CREATE firstapp/src/app/app.module.ts (314 bytes) CREATE firstapp/src/app/app.component.html (24585 bytes) CREATE firstapp/src/app/app.component.spec.ts (962 bytes) CREATE firstapp/src/app/app.component.ts (212 bytes) CREATE firstapp/src/app/app.component.css (0 bytes) √ Packages installed successfully.
4. Перейдём в папку firstapp:
cd firstapp
5. Чтобы запустить проект введём команду ng serve:
- Generating browser application bundles (phase: setup)...Compiling @angular/core : es2015 as esm2015
Compiling @angular/common : es2015 as esm2015
Compiling @angular/platform-browser : es2015 as esm2015
Compiling @angular/platform-browser-dynamic : es2015 as esm2015
√ Browser application bundle generation complete.
Initial Chunk Files | Names | Size
vendor.js | vendor | 2.09 MB
polyfills.js | polyfills | 510.54 kB
styles.css, styles.js | styles | 383.33 kB
main.js | main | 55.03 kB
runtime.js | runtime | 6.62 kB
| Initial Total | 3.02 MB
Build at: 2021-08-28T21:29:26.503Z - Hash: bfa2161563c995dd720fb - Time: 187636ms
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
√ Compiled successfully.
√ Browser application bundle generation complete.
5 unchanged chunks
Build at: 2021-08-28T21:29:44.072Z - Hash: 2a5dbd9b5758732e39ab - Time: 12568ms
√ Compiled successfully.
6. В браузере введём адрес localhost:4200, вуаля!: