Создание приложения с помощью Angular CLI: методы и примеры

Чтобы создать приложение с помощью Angular CLI (интерфейс командной строки), вы можете выполнить следующие действия:

Шаг 1. Установите Node.js и Angular CLI
Сначала убедитесь, что в вашей системе установлен Node.js. Его можно скачать с официального сайта Node.js ( https://nodejs.org ). После установки Node.js откройте терминал или командную строку и выполните следующую команду, чтобы установить Angular CLI глобально:

npm install -g @angular/cli

Шаг 2. Создайте новый проект Angular
После установки Angular CLI вы можете создать новый проект Angular, выполнив следующую команду:

ng new my-app

Эта команда создаст новый каталог с именем «my-app» и создаст в нем базовую структуру проекта Angular.

Шаг 3. Обслуживание приложения
Перейдите в каталог проекта, выполнив следующую команду:

cd my-app

Чтобы запустить сервер разработки и обслуживать приложение, выполните следующую команду:

ng serve

Это скомпилирует приложение и предоставит сервер разработки, работающий по адресу http://localhost:4200. Вы можете получить доступ к своему приложению, открыв этот URL-адрес в веб-браузере.

Шаг 4. Создайте компоненты Angular
Чтобы создать новый компонент Angular, выполните следующую команду:

ng generate component my-component

Это создаст новый компонент с именем «my-comment» внутри каталога src/app. Созданный компонент будет включать файл TypeScript, шаблон HTML и таблицу стилей CSS.

Шаг 5. Используйте компоненты Angular в шаблонах
Чтобы использовать вновь созданный компонент в шаблоне другого компонента, вы можете включить его следующим образом:

<app-my-component></app-my-component>

Шаг 6. Создайте приложение для рабочей среды.
Когда вы будете готовы к развертыванию приложения, вы можете собрать его для рабочей среды, выполнив следующую команду:

ng build --prod

При этом будет создан каталог dist, содержащий оптимизированную и минимизированную версию кода вашего приложения, готовую к развертыванию на веб-сервере.