Angular CLI (інтерфейс командного рядка) – це потужний інструмент, який допомагає розробникам швидко створювати, розробляти та підтримувати Angular-додатки. Він надає команди для створення проектів, побудови, тестування та ефективного розгортання додатків.

Необхідні умови

Перш ніж встановлювати Angular CLI, переконайтеся, що у вас є наступні вимоги:

  • Node.js (рекомендується версія LTS)
  • npm (постачається в комплекті з Node.js)

Ви можете перевірити, чи встановлені Node.js та npm, запустивши їх:

node -v
npm -v

Якщо їх не встановлено, завантажте та встановіть Node.js з офіційного сайту Node.js.

Встановлення Angular CLI

Після встановлення Node.js встановіть Angular CLI глобально за допомогою npm:

npm install -g @angular/cli

Щоб перевірити правильність встановлення, перевірте версію:

ng version

Це повинно відобразити версію Angular CLI разом з Angular залежностями.

Створення нового Angular-проекту

Скористайтеся наступною командою, щоб створити новий проект Angular:

ng new my-angular-app

Вам буде запропоновано вибрати конфігурації, такі як маршрутизація та стилі (CSS, SCSS тощо). Після вибору, CLI налаштує проект.

Перейдіть до каталогу проекту:

cd my-angular-app

Запуск Angular-додатку

Щоб запустити додаток локально, використовуйте:

ng serve

Додаток буде доступний за адресою http://localhost:4200/ на вашій віртуальній машині.

Розуміння команд Angular CLI

Ось деякі основні команди Angular CLI:

  • ng serve – запускає додаток локально.
  • ng generate component component-name – Створює новий компонент.
  • ng build – збирає додаток для виробництва.
  • ng test – Запускає модульні тести.
  • ng e2e – Виконує наскрізні тести.
  • ng add package-name – Встановлює пакунок Angular.
  • ng update – Оновлює Angular та залежності.

Налаштування Angular CLI

Файл angular.json містить налаштування конфігурації проекту, такі як параметри збірки, обслуговування та тестування. Ви можете налаштувати шляхи збірки, каталоги виводу та ресурси.

Висновок

Виконавши ці кроки, ви успішно встановили та налаштували Angular CLI. Цей інструмент впорядковує робочий процес розробки, полегшуючи керування Angular-додатками. Почніть вивчати команди Angular CLI, щоб покращити свій досвід розробки!