Как установить Angular CLI в Ubuntu 22.04

Введение

Angular CLI — это мощный инструмент, который позволяет разработчикам быстро создавать и развертывать приложения Angular. Предоставляет набор команд для быстрой сборки и развертывания приложений на основе ng. Мы также рассмотрим некоторые функции Angular CLI. Функции Angular CLI включают в себя:

• Создание новых проектов с разными шаблонами
• Работа с файлами и ресурсами
• Строительные проекты для производства
• Генерация каркаса кода

В этом сообщении блога мы покажем вам, как установить Angular CLI на Ubuntu 22.04.

Если вы хотите установить Angular на удаленный сервер, продолжайте читать, в противном случае пропустите первый абзац «Подключение к серверу» и читайте следующий.

Подключение к серверу

Чтобы получить доступ к серверу, вам нужно знать IP-адрес. Вам также потребуется ваше имя пользователя и пароль для аутентификации. Чтобы подключиться к серверу как root, введите следующую команду:

ssh root@IP_DEL_SERVER

Далее вам нужно будет ввести пароль пользователя root.

Если вы не используете пользователя root, вы можете войти в систему с другим именем пользователя, используя ту же команду, а затем изменить root на свое имя пользователя:

ssh nome_utente@IP_DEL_SERVER

Затем вам будет предложено ввести пароль пользователя.

Стандартный порт для подключения по ssh — 22, если ваш сервер использует другой порт, вам нужно будет указать его с помощью параметра -p, затем введите следующую команду:

ssh nome_utente@IP_DEL_SERVER -p PORTA

Установите Node.js

Node.js является основным требованием для запуска приложений Angular. Вы можете установить необходимый Node.js с помощью утилиты командной строки NVM. Войдите в свою систему Ubuntu и выполните:

Используйте следующую команду для установки NVM:

curl https://raw.githubusercontent.com/creationix/nvm/master/install.sh | bash

Теперь активируйте среду NVM в вашей системе:

source ~/.bashrc

На сегодняшний день Angular 14 является последней версией, поддерживающей Node.js 14 LTS и 16 LTS. Следующая команда установит Node.js 16 в вашей системе:

nvm install v16

Следующая команда отобразит версию узла и npm, установленных в вашей системе:

node -v

npm -v

Установите угловой интерфейс командной строки

После установки node.js и npm в вашей системе используйте следующие команды для установки инструмента Angular CLI в вашей системе:

npm install @angular/cli --location=global

Последняя версия Angular CLI будет установлена в вашей системе Ubuntu Linux.

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

npm install -g @angular/cli@10 #Angular 10

npm install -g @angular/cli@11 #Angular 11

npm install -g @angular/cli@12 #Angular 12

Использование приведенной выше команды -g установит инструмент Angular CLI глобально. Тогда он будет доступен для всех пользователей и приложений в системе. Angular CLI предоставляет команду ng, используемую для операций командной строки. Давайте проверим установленную версию ng в вашей системе:

ng version

В вашей системе установлен интерфейс командной строки angular. Для существующего приложения вы можете начать свою работу и игнорировать остальную часть статьи.

Выполните следующие шаги, чтобы создать новое приложение Angular в вашей системе.

Создайте новое угловое приложение

Вы можете использовать команду ng для создания нового углового приложения. Создайте приложение с именем hello-world с помощью инструмента командной строки angular. Выполните следующую команду в терминале:

ng new hello-world

? Would you like to add Angular routing? Yes
 ? Which stylesheet format would you like to use? CSS
 CREATE hello-world/README.md (1064 bytes)
 CREATE hello-world/.editorconfig (274 bytes)
 CREATE hello-world/.gitignore (548 bytes)
 CREATE hello-world/angular.json (2947 bytes)
 CREATE hello-world/package.json (1042 bytes)
 CREATE hello-world/tsconfig.json (863 bytes)
 CREATE hello-world/.browserslistrc (600 bytes)
 CREATE hello-world/karma.conf.js (1428 bytes)
 CREATE hello-world/tsconfig.app.json (287 bytes)
 CREATE hello-world/tsconfig.spec.json (333 bytes)
 CREATE hello-world/.vscode/extensions.json (130 bytes)
 CREATE hello-world/.vscode/launch.json (474 bytes)
 CREATE hello-world/.vscode/tasks.json (938 bytes)
 CREATE hello-world/src/favicon.ico (948 bytes)
 CREATE hello-world/src/index.html (296 bytes)
 CREATE hello-world/src/main.ts (372 bytes)
 CREATE hello-world/src/polyfills.ts (2338 bytes)
 CREATE hello-world/src/styles.css (80 bytes)
 CREATE hello-world/src/test.ts (749 bytes)
 CREATE hello-world/src/assets/.gitkeep (0 bytes)
 CREATE hello-world/src/environments/environment.prod.ts (51 bytes)
 CREATE hello-world/src/environments/environment.ts (658 bytes)
 CREATE hello-world/src/app/app-routing.module.ts (245 bytes)
 CREATE hello-world/src/app/app.module.ts (393 bytes)
 CREATE hello-world/src/app/app.component.css (0 bytes)
 CREATE hello-world/src/app/app.component.html (23364 bytes)
 CREATE hello-world/src/app/app.component.spec.ts (1088 bytes)
 CREATE hello-world/src/app/app.component.ts (215 bytes)
 ✔ Packages installed successfully.

Это создаст каталог с именем hello-world в текущем каталоге и создаст все файлы, необходимые для углового приложения.

Обслуживание приложения Angular

Ваше базовое угловое приложение готово к использованию. Перейдите в каталог hello-world, а затем запустите приложение angular с помощью команды ng serve:

cd hello-world

ng serve

По умолчанию приложение angular работает на порту 4200. Доступ к системе можно получить через порт 4200, чтобы открыть приложение angular, например:

• http: //локальный: 4200

Вы можете изменить хост и порт для запуска приложения Angular, указав аргументы командной строки –host и –port:

ng serve --host 0.0.0.0 --port 3001

Использование host 0.0.0.0 позволяет приложению прослушивать все интерфейсы и является общедоступным.

Вывод

В заключение, эта статья показала вам, как установить Angular CLI на Ubuntu 22.04. Этот учебник также помог вам создать новое приложение angular.