Angular CLI - Jak vytvořit nový Angular projekt v Linuxu
Angular je open source, populární a vysoce rozšiřitelný rámec pro vývoj front-end aplikací, který se používá k vytváření mobilních a webových aplikací pomocí TypeScript/JavaScriptu a další běžné jazyky.
Angular je zastřešující termín pro všechny verze Angular, které následují po AngularJS (nebo Angular verzi 1.0), včetně Angular 2 a Angular 4.
Angular se dobře hodí pro vytváření malých i velkých aplikací od začátku. Jednou z klíčových součástí platformy Angular pro podporu vývoje aplikací je nástroj Angular CLI – je to jednoduchý a snadno použitelný nástroj příkazového řádku, který se používá k vytváření , spravovat, sestavovat a testovat aplikace Angular.
V tomto článku vysvětlíme, jak nainstalovat nástroj příkazového řádku Angular v systému Linux, a naučíme se některé základní příklady tohoto nástroje.
Instalace Node.js v Linuxu
Chcete-li nainstalovat Angular CLI, musíte mít na svém systému Linux nainstalovanou nejnovější verzi Node.js a NPM.
Nainstalujte Node.js na Ubuntu
------------- For Node.js v19.x -------------
curl -fsSL https://deb.nodesource.com/setup_19.x | sudo -E bash - &&\
sudo apt-get install -y nodejs
------------- For Node.js v18.x -------------
curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash - &&\
sudo apt-get install -y nodejs
------------- For Node.js v16.x -------------
curl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash - &&\
sudo apt-get install -y nodejs
------------- For Node.js v14.x -------------
curl -fsSL https://deb.nodesource.com/setup_14.x | sudo -E bash - &&\
sudo apt-get install -y nodejs
Nainstalujte Node.js na Debian
------------- For Node.js v19.x -------------
curl -fsSL https://deb.nodesource.com/setup_19.x | bash - &&\
sudo apt-get install -y nodejs
------------- For Node.js v18.x -------------
curl -fsSL https://deb.nodesource.com/setup_18.x | bash - &&\
sudo apt-get install -y nodejs
------------- For Node.js v16.x -------------
curl -fsSL https://deb.nodesource.com/setup_16.x | bash - &&\
sudo apt-get install -y nodejs
------------- For Node.js v14.x -------------
curl -fsSL https://deb.nodesource.com/setup_14.x | bash - &&\
sudo apt-get install -y nodejs
Nainstalujte Node.js na RHEL, CentOS, Fedora, Rocky & Alma Linux
------------- For Node.js v19.x -------------
curl -fsSL https://rpm.nodesource.com/setup_19.x | sudo bash -
sudo yum install -y nodejs
------------- For Node.js v18.x -------------
curl -fsSL https://rpm.nodesource.com/setup_18.x | sudo bash -
sudo yum install -y nodejs
------------- For Node.js v16.x -------------
curl -fsSL https://rpm.nodesource.com/setup_16.x | sudo bash -
sudo yum install -y nodejs
------------- For Node.js v14.x -------------
curl -fsSL https://rpm.nodesource.com/setup_14.x | sudo bash -
sudo yum install -y nodejs
Chcete-li také zkompilovat a nainstalovat nativní doplňky z NPM, budete možná muset do systému nainstalovat vývojové nástroje následujícím způsobem.
sudo apt install -y build-essential [On Debian/Ubuntu]
sudo yum install gcc-c++ make [On RHEL Systems]
Instalace Angular CLI v Linuxu
Jakmile budete mít nainstalované Node.js a NPM, jak je uvedeno výše, můžete nainstalovat Angular CLI pomocí správce balíčků npm následovně (příznak -g
znamená instalaci nástroje pro celý systém, aby jej mohli používat všichni uživatelé systému).
npm install -g @angular/cli
OR
sudo npm install -g @angular/cli
Angular CLI můžete spustit pomocí spustitelného souboru ng
, který by měl být nyní nainstalován na váš systém. Spuštěním následujícího příkazu zkontrolujte nainstalovanou verzi Angular CLI.
ng version
OR
ng --version
Vytvoření úhlového projektu pomocí Angular CLI
V této části si ukážeme, jak vytvořit, sestavit a obsluhovat nový základní projekt Angular. Nejprve se přesuňte do adresáře webroot vašeho serveru a poté inicializujte novou aplikaci Angular následovně (nezapomeňte postupovat podle pokynů):
cd /var/www/html/
ng new tecmint-app #as root
OR
sudo ng new tecmint-app #non-root user
Dále se přesuňte do adresáře aplikace, který byl právě vytvořen, a obsluhujte aplikaci podle obrázku.
cd tecmint-app
ls #list project files
ng serve
Pokud máte spuštěnou službu brány firewall, abyste mohli přistupovat k nové aplikaci z webového prohlížeče, musíte v konfiguraci brány firewall otevřít port 4200, jak je znázorněno.
---------- On Firewalld ----------
firewall-cmd --permanent --zone=public --add-port=4200/tcp
firewall-cmd --reload
---------- On UFW ----------
sudo ufw allow 4200/tcp
sudo ufw reload
Nyní můžete otevřít webový prohlížeč a procházet pomocí následující adresy, abyste viděli spuštění nové aplikace, jak je znázorněno na následujícím snímku obrazovky.
http://localhost:4200/
or
http://SERVER_IP:4200
Poznámka: Pokud použijete příkaz ng
serve k vytvoření aplikace a budete ji sloužit místně, jak je uvedeno výše, server aplikaci automaticky znovu sestaví a znovu načte webovou stránku (stránky), když změníte některý ze zdrojových souborů.
Další informace o nástroji ng získáte spuštěním následujícího příkazu.
ng help
Domovská stránka Angular CLI: https://angular.io/cli
V tomto článku jsme si ukázali, jak nainstalovat Angular CLI na různé distribuce Linuxu. Také jsme se zabývali tím, jak sestavit, zkompilovat a obsluhovat základní aplikaci Angular na vývojovém serveru. Máte-li jakékoli dotazy nebo myšlenky, o které se s námi chcete podělit, použijte níže uvedený formulář zpětné vazby.