Angular CLI - Comment créer un nouveau projet angulaire sous Linux
Angular est un framework de développement d'applications frontales open source, populaire et hautement extensible, utilisé pour créer des applications mobiles et Web à l'aide de TypeScript/JavaScript et d’autres langages courants.
Angular est un terme générique désignant toutes les versions Angular qui suivent AngularJS (ou Angular version 1.0), y compris Angular 2. , et Angular 4.
Angular est bien adapté à la création d'applications à petite ou grande échelle à partir de zéro. L'un des composants clés de la plate-forme Angular pour faciliter le développement d'applications est l'utilitaire Angular CLI : il s'agit d'un outil en ligne de commande simple et facile à utiliser utilisé pour créer , gérez, créez et testez des applications angulaires.
Dans cet article, nous expliquerons comment installer l'outil de ligne de commande Angular sur un système Linux et apprendrons quelques exemples de base de cet outil.
Installer Node.js sous Linux
Pour installer Angular CLI, vous devez disposer de la dernière version de Node.js et de NPM installée sur votre système Linux.
Installez Node.js sur 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
Installer Node.js sur 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
Installez Node.js sur RHEL, CentOS, Fedora, Rocky et 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
De plus, pour compiler et installer des modules complémentaires natifs de NPM, vous devrez peut-être installer les outils de développement sur votre système comme suit.
sudo apt install -y build-essential [On Debian/Ubuntu]
sudo yum install gcc-c++ make [On RHEL Systems]
Installation de la CLI angulaire sous Linux
Une fois Node.js et NPM installés, comme indiqué ci-dessus, vous pouvez installer l'Angular CLI à l'aide du gestionnaire de packages npm. comme suit (l'indicateur -g
signifie installer l'outil à l'échelle du système pour qu'il soit utilisé par tous les utilisateurs du système).
npm install -g @angular/cli
OR
sudo npm install -g @angular/cli
Vous pouvez lancer la Angular CLI à l'aide de l'exécutable ng
qui devrait maintenant être installé sur votre système. Exécutez la commande suivante pour vérifier la version de Angular CLI installée.
ng version
OR
ng --version
Création d'un projet angulaire à l'aide de la CLI angulaire
Dans cette section, nous montrerons comment créer, construire et servir un nouveau projet Angular de base. Tout d'abord, accédez au répertoire webroot de votre serveur, puis initialisez une nouvelle application Angular comme suit (n'oubliez pas de suivre les instructions) :
cd /var/www/html/
ng new tecmint-app #as root
OR
sudo ng new tecmint-app #non-root user
Ensuite, accédez au répertoire d'application qui vient d'être créé et servez l'application comme indiqué.
cd tecmint-app
ls #list project files
ng serve
Avant de pouvoir accéder à votre nouvelle application à partir d'un navigateur Web, si un service de pare-feu est en cours d'exécution, vous devez ouvrir le port 4200 dans la configuration du pare-feu, comme indiqué.
---------- On Firewalld ----------
firewall-cmd --permanent --zone=public --add-port=4200/tcp
firewall-cmd --reload
---------- On UFW ----------
sudo ufw allow 4200/tcp
sudo ufw reload
Vous pouvez maintenant ouvrir un navigateur Web et naviguer en utilisant l'adresse suivante pour voir la nouvelle application s'exécuter comme indiqué dans la capture d'écran suivante.
http://localhost:4200/
or
http://SERVER_IP:4200
Remarque : Si vous utilisez la commande ng
serve pour créer une application et la servir localement, comme indiqué ci-dessus, le serveur reconstruit automatiquement l'application. et recharge la ou les pages Web lorsque vous modifiez l'un des fichiers source.
Pour plus d'informations sur l'outil ng, exécutez la commande suivante.
ng help
La page d'accueil d'Angular CLI : https://angular.io/cli
Dans cet article, nous avons montré comment installer la Angular CLI sur différentes distributions Linux. Nous avons également expliqué comment créer, compiler et servir une application angulaire de base sur un serveur de développement. Pour toute question ou réflexion que vous souhaitez partager avec nous, utilisez le formulaire de commentaires ci-dessous.