Πώς να δημιουργήσετε και να εκτελέσετε Angular εφαρμογές χρησιμοποιώντας το Angular CLI και το PM2
Το Angular CLI είναι μια διεπαφή γραμμής εντολών για το πλαίσιο Angular, η οποία χρησιμοποιείται για τη δημιουργία, τη δημιουργία και την εκτέλεση της εφαρμογής σας τοπικά κατά την ανάπτυξη.
Έχει σχεδιαστεί για τη δημιουργία και τη δοκιμή ενός έργου Angular σε έναν διακομιστή ανάπτυξης. Ωστόσο, εάν θέλετε να εκτελείτε/κρατήσετε τις εφαρμογές σας για πάντα ζωντανές στην παραγωγή, χρειάζεστε έναν διαχειριστή διαδικασιών Node.js όπως το PM2.
Το PM2 είναι ένας δημοφιλής, προηγμένος και πλούσιος σε δυνατότητες διαχείρισης διαδικασίας παραγωγής για εφαρμογές Node.js με ενσωματωμένο εξισορροπητή φορτίου.
Το σύνολο χαρακτηριστικών του περιλαμβάνει υποστήριξη για παρακολούθηση εφαρμογών, αποτελεσματική διαχείριση μικροϋπηρεσιών/διαδικασιών, λειτουργία συμπλέγματος εφαρμογών εκτέλεσης και χαριτωμένη επανεκκίνηση και τερματισμό εφαρμογών. Επίσης, υποστηρίζει την εύκολη διαχείριση των αρχείων καταγραφής εφαρμογών και πολλά άλλα.
Σε αυτό το άρθρο, θα σας δείξουμε πώς να εκτελείτε εφαρμογές Angular χρησιμοποιώντας τη διαχείριση διαδικασιών Angular CLI και PM2 Node.js. Αυτό σας επιτρέπει να εκτελείτε την εφαρμογή σας συνεχώς κατά τη διάρκεια της ανάπτυξης.
Απαιτήσεις
Πρέπει να έχετε εγκατεστημένα στον διακομιστή σας τα ακόλουθα πακέτα για να συνεχίσετε:
- Node.js και NPM
- Γωνιακό CLI
- PM2
Σημείωση: Εάν έχετε ήδη εγκαταστήσει τα Node.js και NPM στο σύστημα Linux, μεταβείτε στο Βήμα 2.
Βήμα 1: Εγκατάσταση του Node.js σε Linux
Για να εγκαταστήσετε την πιο πρόσφατη έκδοση του Node.js, πρώτα προσθέστε το αποθετήριο NodeSource στο σύστημά σας όπως φαίνεται και εγκαταστήστε το πακέτο. Μην ξεχάσετε να εκτελέσετε τη σωστή εντολή για την έκδοση Node.js που θέλετε να εγκαταστήσετε στη διανομή Linux σας.
Εγκαταστήστε το Node.js στο 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
Εγκαταστήστε το Node.js στο 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
Εγκαταστήστε το Node.js σε Διανομές που βασίζονται σε RHEL
------------- 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
Επιπλέον, εγκαταστήστε επίσης εργαλεία ανάπτυξης στο σύστημά σας, ώστε να μπορείτε να μεταγλωττίσετε και να εγκαταστήσετε εγγενή πρόσθετα από το NPM.
sudo apt install build-essential [On Debian/Ubuntu]
yum install gcc-c++ make [On CentOS/RHEL]
dnf install gcc-c++ make [On Fedora]
Αφού εγκαταστήσετε τα Node.js και NPM, μπορείτε να ελέγξετε τις εκδόσεις τους χρησιμοποιώντας τις ακόλουθες εντολές.
node -v
npm -v
Βήμα 2: Εγκατάσταση Angular CLI και PM2
Στη συνέχεια, εγκαταστήστε τα Angular CLI και PM2 χρησιμοποιώντας τη npm διαχείριση πακέτων όπως φαίνεται. Στις παρακάτω εντολές, η επιλογή -g σημαίνει την καθολική εγκατάσταση των πακέτων – που μπορούν να χρησιμοποιηθούν από όλους τους χρήστες του συστήματος.
sudo npm install -g @angular/cli #install Angular CLI
sudo npm install -g pm2 #install PM2
Βήμα 3: Δημιουργία ενός Angular Project χρησιμοποιώντας Angular CLI
Τώρα μετακινηθείτε στον κατάλογο webroot του διακομιστή σας και, στη συνέχεια, δημιουργήστε, δημιουργήστε και εξυπηρετήστε την εφαρμογή Angular (που ονομάζεται sysmon-app, αντικαταστήστε την με το όνομα της εφαρμογής σας) χρησιμοποιώντας Γωνιακό CLI.
cd /srv/www/htdocs/
sudo ng new sysmon-app #follow the prompts
Στη συνέχεια, μετακινηθείτε στον κατάλογο της εφαρμογής (η πλήρης διαδρομή είναι /srv/www/htdocs/sysmon-app) που μόλις δημιουργήθηκε και εξυπηρετεί την εφαρμογή όπως φαίνεται.
cd sysmon-app
sudo ng serve
Από την έξοδο της εντολής ng serve, μπορείτε να δείτε ότι η εφαρμογή Angular δεν εκτελείται στο παρασκήνιο, δεν μπορείτε πλέον να έχετε πρόσβαση στη γραμμή εντολών. Επομένως, δεν μπορείτε να εκτελέσετε άλλες εντολές ενώ εκτελείται.
Επομένως, χρειάζεστε έναν διαχειριστή διεργασιών για τον έλεγχο και τη διαχείριση της εφαρμογής: να την εκτελείτε συνεχώς (για πάντα) και επίσης να ενεργοποιείται η αυτόματη εκκίνηση κατά την εκκίνηση του συστήματος, όπως εξηγείται στην επόμενη ενότητα.
Πριν μεταβείτε στην επόμενη ενότητα, τερματίστε τη διαδικασία πατώντας [Ctl + C] για να ελευθερώσετε τη γραμμή εντολών.
Βήμα 4: Εκτέλεση Angular Project Forever με χρήση PM2
Για να εκτελέσετε τη νέα σας εφαρμογή στο παρασκήνιο, ελευθερώνοντας τη γραμμή εντολών, χρησιμοποιήστε το PM2 για να την εξυπηρετήσετε, όπως φαίνεται. Το PM2 βοηθά επίσης κοινές εργασίες διαχείρισης συστήματος, όπως επανεκκίνηση σε περίπτωση αποτυχίας, διακοπή και επαναφόρτωση διαμορφώσεων χωρίς διακοπές λειτουργίας και πολλά άλλα.
pm2 start "ng serve" --name sysmon-app
Στη συνέχεια, για να αποκτήσετε πρόσβαση στη διεπαφή ιστού της εφαρμογής σας, ανοίξτε ένα πρόγραμμα περιήγησης και πλοηγηθείτε χρησιμοποιώντας τη διεύθυνση http://localhost:4200 όπως φαίνεται στο παρακάτω στιγμιότυπο οθόνης.
Σε αυτόν τον οδηγό, δείξαμε πώς να εκτελείτε εφαρμογές Angular χρησιμοποιώντας το Angular CLI και το PM2 process manager. Εάν έχετε επιπλέον ιδέες για να μοιραστείτε ή ερωτήσεις, επικοινωνήστε μαζί μας μέσω της παρακάτω φόρμας σχολίων.