Πώς να χρησιμοποιήσετε το TypeScript με το έργο Node.js

Το TypeScript είναι βολικό για τη δημιουργία πολύπλοκων εφαρμογών και ισχυρών αρχιτεκτονικών όπως οι μικροϋπηρεσίες. Φυσικά, το TypeScript δεν μπορεί να κάνει κάτι που δεν μπορεί να κάνει η JavaScript, αλλά μπορεί να κάνει τα σύνθετα έργα πιο διαχειρίσιμα. Η αυστηρή πληκτρολόγηση και η υποστήριξη διεπαφών του TypeScript σημαίνει ότι είναι εξαιρετικό για αντικειμενοστραφή προγραμματισμό. Έχουμε δει πολλές εταιρείες να στρέφονται στο TypeScript για την κωδικοποίηση του backend τους.

Δεν υπάρχει καλύτερος χρόνος για να αρχίσετε να χρησιμοποιείτε το TypeScript στο έργο σας Node.js από τώρα. Αλλά πώς μπορείτε να το ρυθμίσετε για το έργο Node.js; Θα μάθετε σε αυτό το άρθρο.

Τι είναι το TypeScript;

Το TypeScript είναι μια μεταγλωττισμένη, αυστηρά πληκτρολογημένη έκδοση JavaScript που αναπτύχθηκε και διατηρείται από τη Microsoft. Ο κώδικας TypeScript μετατρέπεται σε JavaScript.

Η φύση αυστηρής πληκτρολόγησης του TypeScript βοηθά τους προγραμματιστές να αποφεύγουν σφάλματα στον κώδικά τους. Θα μεταγλωττίσει μόνο κώδικα που ικανοποιεί τους κανόνες των καθορισμένων τύπων δεδομένων του. Αυτό καθιστά τον κώδικα TypeScript πιο ισχυρό από τον καθαρό αντίστοιχο JavaScript.

Υποστηρίζει επίσης λειτουργικό και αντικειμενοστραφή προγραμματισμό. Όλα αυτά τα χαρακτηριστικά το καθιστούν εξαιρετικά επεκτάσιμο και κατάλληλο για την ανάπτυξη πολύπλοκων εφαρμογών.

Πώς να ρυθμίσετε το TypeScript στο Node. JS

Θα πρέπει να δημιουργήσετε μερικές διαμορφώσεις εδώ και εκεί για να αρχίσετε να χρησιμοποιείτε το TypeScript με το έργο σας Node.js. Αλλά μην ανησυχείς, είναι εύκολο.

Ωστόσο, βεβαιωθείτε ότι εσείς εγκαταστήστε το πακέτο Node.js npm πριν προχωρήσετε.

Αρχικοποιήστε ένα αρχείο package.json

Ανοίξτε το τερματικό σας και δημιουργήστε έναν φάκελο έργου. Στη συνέχεια, εισαγάγετε αυτόν τον νέο κατάλογο και αρχικοποιήστε ένα έργο Node.js:

npm init

Η παραπάνω εντολή δημιουργεί ένα πακέτο.json αρχείο για να αποθηκεύσετε τις εξαρτήσεις σας.

Εγκαταστήστε το TypeScript και άλλες εξαρτήσεις

Στη συνέχεια, προχωρήστε και εγκαταστήστε το TypeScript στο έργο Node.js:

npm i -D γραφομηχανή

ο -ΡΕ λέξη-κλειδί διασφαλίζει ότι το TypeScript εγκαθίσταται ως μέρος του Εξαρτήσεις dev σε πακέτο.json.

Θα πρέπει επίσης να εγκαταστήσετε @types/express, ένας ορισμός TypeScript για το Express.js:

npm εγκατάσταση -D @τύποι/express

Στη συνέχεια, αρχικοποιήστε a tsconfig.json αρχείο. Αυτό περιγράφει λεπτομερώς τις επιλογές του βασικού μεταγλωττιστή για το έργο σας:

npx tsc --μέσα σε αυτό

Η παραπάνω εντολή δημιουργεί ένα tsconfig.json αρχείο στον ριζικό φάκελο του έργου σας.

Επίσης, εγκαταστήστε το Express.js. Μπορείτε να το παραλείψετε εάν σκοπεύετε να διαχειριστείτε μόνο διακομιστές με ενσωματωμένα πρωτόγονα HTTP του Node.js. Αλλά το Express.js το κάνει αυτό εύκολο:

npm εγκαθιστώ εξπρές

Στη συνέχεια, εγκαταστήστε κόμβος, ένα πακέτο που κάνει επανεκκίνηση του διακομιστή σας αυτόματα κάθε φορά που υπάρχουν αλλαγές στον κώδικά σας. Βεβαιωθείτε ότι έχετε εγκαταστήσει αυτό παγκοσμίως για να λειτουργεί:

npm εγκαθιστώ -g nodemon

Διαμόρφωση TypeScript με Node. JS

Ανοιξε το tsconfig.json αρχείο που αρχικοποιήσατε νωρίτερα χρησιμοποιώντας το δικό σας επιλεγμένο πρόγραμμα επεξεργασίας κώδικα. Μπορεί να υπάρχουν πολλά σε αυτό το αρχείο. Αν και μπορείτε να διαμορφώσετε αυτό το αρχείο στην τρέχουσα μορφή του, μπορείτε να αντικαταστήσετε ολόκληρο το περιεχόμενό του με το παρακάτω για να το κάνετε πιο απλό.

Εδώ είναι όλα όσα χρειάζεστε tsconfig.json για να ξεκινήσετε:

{
"Επιλογές μεταγλωττιστή": {
"μονάδα μέτρησης": "commonjs",
"esModuleInterop": αλήθεια,
"στόχος": "es6",
"Ανάλυση ενότητας": "κόμβος",
"πηγήΧάρτης": αλήθεια,
"outDir": "απόσταση" //Καθορίζει τον κατάλογο του transpiler. 
 },
"lib": ["es2015"]
}

Τώρα ανοιχτό πακέτο.json. Δείτε πώς φαίνεται αυτή τη στιγμή μετά την εγκατάσταση του TypeScript και του Express:

Στη συνέχεια, προσθέστε τις ακόλουθες διαμορφώσεις στο σενάρια πίνακας:

"σενάρια": {
"δοκιμή": "ηχώ \"Σφάλμα: δεν έχει καθοριστεί δοκιμή\"&& έξοδος 1",
"χτίζω": "npx tsc",
"αρχή": "κόμβος ./dist/app.js",
"απόσταση": "tsc -p .",
 "dev": "nodemon ./src/app.ts", //Αντικαθιστώ Αυτό με το σωστό ΕυρετήριομονοπάτιΓια app.ts σε τα δικα σου υπόθεση
"τύπος": "μονάδα μέτρησης"
}

Η παραπάνω διαμόρφωση υποδεικνύει τον διακομιστή σας να ξεκινήσει app.js, ο μεταφραστής. Μην ανησυχείτε, αυτό είναι ένα προεπιλεγμένο αρχείο που θα δημιουργηθεί αυτόματα σε α απόσταση φάκελο όταν εκτελείτε το χτίζω γραφή. Θα το κάνετε αυτό αργότερα στη συνέχεια.

Στη συνέχεια, η διαμόρφωση καθορίζει το πρωτεύον σενάριο ανάπτυξης ως app.ts.

Ως εκ τούτου, όταν ξεκινάτε το περιβάλλον ανάπτυξης, κόμβος τρέχει app.ts. Στη συνέχεια, το Node.js το μεταγλωττίζει σε JavaScript μέσα app.js—που επικοινωνεί με τον διακομιστή HTTP.

Στη συνέχεια, δημιουργήστε ένα src φάκελο στον ριζικό κατάλογο του έργου σας. Μέσα σε αυτόν τον φάκελο, δημιουργήστε ένα κενό αρχείο TypeScript και ονομάστε το app.ts.

Δημιουργήστε τον κατάλογο Transpiler

Το transpiler είναι ένα αρχείο JavaScript που μεταγλωττίζει τον κώδικα TypeScript σε εγγενή JavaScript. Έτσι, αυτό διασφαλίζει ότι ο διακομιστής μπορεί να συσχετιστεί με τον κώδικά σας ως JavaScript αντί για το αυστηρά πληκτρολογημένο σενάριο.

Έτσι, ενώ το TypeScript χειρίζεται τη δομή κώδικα, το αρχείο transpiler τον μεταγλωττίζει σε JavaScript.

Τώρα τρέξτε το χτίζω σενάριο για τη δημιουργία του απόσταση κατάλογος transpiler αυτόματα:

npm εκτέλεση κατασκευής

Η παραπάνω εντολή μεταγλωττίζει τον κώδικα TypeScript σε JavaScript. Ο δημιουργημένος φάκελος περιέχει δύο αρχεία. app.js και app.js.map.

Ανοιξε πακέτο.json πάλι. Θα δείτε ένα κλειδί στον πίνακα με το όνομα κύριος. Μπορείτε να δείτε ότι η τιμή του δείχνει index.js. Αντικαταστήστε το με το app.js κατάλογος αρχείων (transpiler):

"κύριος": "./dist/app.js",

Μετά τη μορφοποίηση, πακέτο.json θα πρέπει να μοιάζει με αυτό:

Αυτό είναι για το μέρος των διαμορφώσεων.

Δημιουργήστε και εκτελέστε ένα αίτημα HTTP

Τώρα προσπαθήστε να δημιουργήσετε και να εκτελέσετε ένα αίτημα HTTP μέσω του διακομιστή Express.js για να δείτε εάν ο κώδικάς σας μεταγλωττίζεται όπως θα έπρεπε.

Μέσα app.ts:

εισαγωγή express, {Request, Response} από 'εξπρές'
συνθ app = express()
app.get('/', async (απαιτ.: Αίτημα, ανταπόκριση: Απόκριση)=>{
 console.log('Γειά σου Κόσμε')
 res.send('Γειά σου Κόσμε')
})
συνθ λιμάνι = 8080
app.listen (port, (): κενός=>{
κονσόλα.κούτσουρο(«Η εφαρμογή ακούει στο http://localhost:${port}`)
})

Στη συνέχεια, ανοίξτε τη γραμμή εντολών στον ριζικό κατάλογο του έργου σας και εκτελέστε το dev σενάριο για να ξεκινήσετε το έργο σας:

npm εκτέλεση dev

Ανοίξτε το πρόγραμμα περιήγησής σας και μεταβείτε στο localhost: 8080, και θα δεις την απάντηση (Γειά σου Κόσμε). Θα το δείτε επίσης στο τερματικό εάν έχετε εφαρμόσει το console.log εντολή όπως κάναμε στο παραπάνω παράδειγμα.

Το TypeScript έχει προοπτικές υψηλής ζήτησης

Δεν υπάρχει σχεδόν μεγάλη διαφορά μεταξύ TypeScript και JavaScript. Αλλά το πρώτο διευκολύνει την ανάπτυξη με την προσθήκη αυστηρής πληκτρολόγησης.

Η TypeScript είναι μια πολύτιμη γλώσσα σε πλαίσια frontend όπως το Angular, και δεν μπορούμε να αρνηθούμε την απόδοση και την επεκτασιμότητα της. Γίνεται πιο δημοφιλές και οι προοπτικές εργασίας για τους προγραμματιστές TypeScript συνεχίζουν να αυξάνονται.

Μια εισαγωγή στο Angular

Διαβάστε Επόμενο

Σχετικά με τον Συγγραφέα