Γεια σας, έχω ακούσει ότι αν εγκαταστήσω το Node.js στον υπολογιστή μου, μπορώ να οργανώσω και να αυτοματοποιήσω καλύτερα τις εργασίες προγραμματισμού και ανάπτυξης ιστοσελίδων εγκαθιστώντας και χρησιμοποιώντας διάφορα πακέτα NPM...
Έχω κάποιες ερωτήσεις:
- Μπορείτε παρακαλώ να μοιραστείτε πώς εγκαθιστάτε το NodeJS και το npm στο PHPStorm και ίσως κάποια κόλπα/επιχειρήματα για την αυτοματοποίηση της εργασίας, ώστε η διαδικασία dev να είναι ευκολότερη;
- Έχετε αγαπημένα πακέτα npm που θα προτείνατε;
- Ίσως κάποια πακέτα npm που χρησιμοποιείτε καθημερινά; Όπως η αυτόματη ανανέωση του προγράμματος περιήγησης;
Ευχαριστώ!
Γεια σας,
Πρώτον, πρέπει να εγκαταστήστε το node.js στον υπολογιστή σας (λήψη από ΕΔΩ); Για να ελέγξετε αν έχει εγκατασταθεί σωστά, θα πρέπει να ελέγξτε την έκδοση του node js στο cmd (ή στο PHPStorm's terminal) πληκτρολογώντας:
node -v
Στη συνέχεια, στο φάκελο του έργου σας χρησιμοποιώντας το τερματικό του PHPStorm (ή το cmd του Window) πρέπει να αρχικοποίηση npm. Στον τύπο τερματικού:
npm init -y
Στο φάκελο του έργου σας αυτό θα δημιουργήσει node_modules με όλα τα πακέτα που εγκαθιστάτε. Θα δημιουργήσει επίσης package.json αρχείο με τις πληροφορίες των εξαρτήσεων. Το αρχείο του Npm package.json είναι ένα είδος συνταγής/καταλόγου τροφίμων του έργου μας με τις εξαρτήσεις των πακέτων npm που εγκαθιστάτε.
Στη συνέχεια, για να εγκαταστήσετε ένα πακέτο npm πληκτρολογήστε στο τερματικό:
npm install lodash
Σε αυτή την περίπτωση lodash είναι το όνομα του πακέτου. Ακολουθεί ένα άλλο παράδειγμα (εγκατάσταση του normalize.css):
npm install normalize.css
...ή εγκαταστήστε μερικά απαραίτητα πακέτα npm χωρισμένα με κενό:
npm install postcss-simple-vars postcss-nested autoprefixer --save-dev
Όλα αυτά τα πακέτα προέρχονται από https://www.npmjs.com - μπορείτε να αναζητήσετε εκεί ένα πακέτο που σας ενδιαφέρει.
Για να εκτελέσετε το npm θα πρέπει να πληκτρολογήσετε:
npm run dev
Γιατί λοιπόν είναι σημαντικό το NPM για το έργο μας;
Για παράδειγμα, αν συμβεί κάτι στον υπολογιστή μας (κάποια συντριβή), μπορούμε να να ανακάμπτει πάντα το έργο μας κλωνοποιώντας το έργο από το GitHub (μάθετε πώς να χρησιμοποιείτε το GitHub και το Git με το PHPStorm IDE) και μετά την κλωνοποίηση του έργου - το package.json αρχείο (το resipe του έργου μας) θα είναι μέσα και αφού πληκτρολογήσουμε στο τερματικό εγκατάσταση npm όλα τα πακέτα npm θα εγκατασταθούν/ανακτηθούν ξανά! Υπέροχα! 🙂
Εδώ είναι μερικά πακέτα npm που χρησιμοποιώ με το PHPStorm:
Χρησιμοποιήστε οπωσδήποτε webpack-dev-server; Εδώ είναι ο τρόπος εγκατάστασης αυτού του εξαιρετικού πακέτου αυτοματισμού npm. Απλά πληκτρολογήστε:
npm install webpack-dev-server --save-dev
Για τη χαλαρή φόρτωση των εικόνων που χρησιμοποιώ: lazysizes
Μπορείτε να το εγκαταστήσετε πληκτρολογώντας:
npm install lazysizes
