نحوه راه اندازی یک پروژه Node با Typescript

Node یک محیط زمان اجرا میباشد که امکان نوشتن JavaScript در سمت سرور مجازی را ممکن می کند. از زمان انتشار آن در سال 2011 به صورت گسترده پذیرفته شده است. نوشتن جاوا اسکریپت در سمت سرور مجازی می تواند چالش برانگیز باشد زیرا پایه کد به دلیل ماهیت زبان JavaScriptیعنی تایپ دینامیک و سست گسترده می شود.
توسعه دهندگان که از زبان های دیگر به سراغ JavaScript می آیند غالباً از عدم وجود تایپ استاتیک قوی شکایت دارند ، اما اینجاست که TypeScript به کار می آید تا این شکاف را برطرف کند.
TypeScript یک فوق مجموعه تایپ شده (اختیاری) از JavaScript است که می تواند در ساخت و مدیریت پروژه های بزرگ JavaScript کمک کند. می تواند به عنوان JavaScript با ویژگیهای اضافی مانند تایپ استاتیک قوی ، کامپایل و برنامه نویسی شی گرا در نظر گرفته شود.
توجه: از نظر فنی TypeScript مجموعه ای فوق العاده از JavaScript است ، بدین معنی که کلیه کد های JavaScript کدهای TypeScript معتبر هستند.

در اینجا مزایای استفاده از TypeScript آورده شده است:
1- تایپ استاتیک اختیاری.
2- استنباط تایپ.
3- امکان استفاده از رابط ها.
در این آموزش یک پروژه Node با TypeScript تنظیم می کنید. یک برنامه Express با استفاده از TypeScript ایجاد خواهید کرد و آن را به کد JavaScript شسته و رفته و معتبر تبدیل می کنید.
پیش نیازها
قبل از شروع این راهنما ، به Node.js نصب شده بر روی دستگاه تان نیاز خواهید داشت. شما می توانید این کار را با دنبال کردن آموزش نحوه نصب Node.js و ایجاد یک راهنمای توسعه محلی برای سیستم عامل خود انجام دهید.
مرحله 1 – شروع یک پروژه npm
برای شروع ، یک پوشه جدید با نام node_project ایجاد کنید و به آن دیرکتوری بروید.
⦁ $ mkdir node_project
⦁
⦁ $ cd node_project

سپس ، آن را به عنوان یک پروژه npm آغاز کنید:
⦁ $ npm init
⦁
بعد از اجرای npm init ، باید اطلاعاتی در مورد پروژه خود به npm ارائه کنید. اگر ترجیح می دهید npm پیش فرض های معقولی را تصور کند ، می توانید پرچم y را اضافه کنید تا اعلان های درخواست اطلاعات بیشتر را رد کند:
⦁ $ npm init -y
⦁
اکنون که فضای پروژه شما تنظیم شده است ، آماده هستید تا به نصب متعلقات لازم بپردازید.
مرحله 2 – نصب متعلقات
با شروع یک پروژه npm ، مرحله بعدی نصب متعلقاتی است که برای اجرای TypeScript لازم است.
برای نصب متعلقات دستورات زیر را از دیرکتوری پروژه خود اجرا کنید:
⦁ $ npm install -D typescript@3.3.3
⦁
⦁ $ npm install -D tslint@5.12.1

پرچم -D میانبر برای: –save-dev است. می توانید در مستندات npmjs اطلاعات بیشتری در مورد این پرچم کسب کنید.
اکنون زمان آن رسیده است که فریم ورک Express را نصب کنید:
⦁ $ npm install -S express@4.16.4
⦁
⦁ $ npm install -D ⦁ @types/express@4.16.1

دستور دوم انواع Express را برای پشتیبانی TypeScript نصب می کند. انواع در TypeScript فایلهایی هستند که معمولاً دارای پسوند .d.ts هستند. از فایل ها برای تهیه نوع اطلاعات در مورد یک API ، در این حالت چارچوب Express استفاده می شود.
این بسته لازم است زیرا TypeScript و Express بسته های مستقل هستند. بدون بسته @types/express ، هیچ راهی برای TypeScript برای اطلاع از انواع کلاس های Express وجود ندارد.
مرحله 3 – پیکربندی TypeScript
در این بخش TypeScript را تنظیم می کنید و linting را برای TypeScript پیکربندی می کنید. TypeScript برای پیکربندی گزینه های کامپایلر برای یک پروژه از فایلی به نام tsconfig.json استفاده می کند. یک فایل tsconfig.json را در ریشه دایرکتوری پروژه ایجاد کنید و در قسمت زیر جایگذاری کنید:
tsconfig.json
{
compilerOptions”: {
module”: commonjs”,
esModuleInterop”: true,
target”: es6”,
moduleResolution”: node”,
sourceMap”: true,
outDir”: dist”
},
lib”: [es2015”]
}

بیایید برخی از کلیدهای موجود در قسمت JSON را بررسی کنیم:
⦁ module: روش تولید کد ماژول را مشخص می کند. Node از Commonjs استفاده می کند.
⦁ target: سطح زبان خروجی را مشخص می کند.
⦁ moduleResolution: به کامپایلر کمک می کند تا بفهمد ورودی به چه چیزی اطلاق می شود. مقدار Node از مکانیزم وضوح ماژول Node تقلید می کند.
⦁ outDir: مکان خروجی فایل های .js پس از transpilation است. در این آموزش آن را به عنوان dist ذخیره می کنیم.
جایگزینی برای ایجاد و پر کردن فایل tsconfig.json به صورت دستی اجرای دستور زیر است:
⦁ tsc –init
⦁
این دستور یک فایل tsconfig.json به خوبی کامنت شده را تولید می کند.
برای کسب اطلاعات بیشتر در مورد گزینه های مقدار کلیدی موجود ، اسناد رسمی TypeScript توضیحات مربوط به هر گزینه را ارائه می دهد.
اکنون می توانید linting TypeScript را برای پروژه پیکربندی کنید. در ترمینالی که در ریشه دایرکتوری پروژه شما اجرا میشود ، و این آموزش آن را با عنوان node_project بنا نهاده است ، دستور زیر را برای تولید یک فایل tslint.json اجرا کنید:
⦁ $ ./node_modules/.bin/tslint –init
⦁
فایل tslint.json تازه تولید شده را باز کنید و قانون no-console را نیز بر این اساس اضافه کنید:
tslint.json
{
defaultSeverity”: error”,
extends”: [tslint:recommended”],
jsRules”: {},
rules”: {
no-console”: false
},
rulesDirectory”: []
}

به طور پیش فرض ،TypeScript linter مانع استفاده از اشکال زدایی با استفاده از عبارات console  می شود ، از این رو باید صراحتا به linter گفته شود که قانون پیش فرض no-console را باطل کند.
مرحله 4 – بروزرسانی فایل pack.json
در این مرحله از آموزش ، می توانید توابع را در ترمینال به صورت جداگانه اجرا کنید ، یا یک اسکریپت npm برای اجرای آنها ایجاد کنید.
در این مرحله یک اسکریپت شروع می کنید که کد TypeScript را کامپایل و transpile می کند ، و سپس برنامه .js حاصل را اجرا می کند.
فایل pack.json را باز کنید و بر این اساس آن را به روز کنید:
package.json
{
name”: node-with-ts”,
version”: 1.0.0”,
description”: ”,
main”: dist/app.js”,
scripts”: {
start”: tsc && node dist/app.js”,
test”: echo \”Error: no test specified\” && exit 1″
},
author”: ”,
license”: ISC”,
devDependencies”: {
@types/express”: ^4.16.1”,
tslint”: ^5.12.1”,
typescript”: ^3.3.3”
},
dependencies”: {
express”: ^4.16.4”
}
}

در قطعه کد بالا مسیر اصلی را به روز کردید و دستور start را به بخش اسکریپت ها اضافه کردید. هنگام مشاهده فرمان شروع ، خواهید دید که ابتدا دستور tsc اجرا می شود ، و سپس دستور node. این کار خروجی تولید شده را با node کامپایل و اجرا می کند.
دستور tsc به TypeScript می گوید که برنامه را کامپایل کرده و خروجی تولید شده .js را همانطور که در فایل tsconfig.json تنظیم شده است در دیرکتوری پوشه outDir قرار دهد.
مرحله 5 – ایجاد و اجرای یک سرور مجازی اصلی اکسپرس
اکنون که پیکربندی TypeScript و linter آن صورت گرفته است ، زمان آن رسیده که یک سرور مجازی Node Express بسازید.
ابتدا یک پوشه src در ریشه دیرکتوری پروژه خود ایجاد کنید:
⦁ $ mkdir src
⦁
سپس فایلی به نام app.ts را درون آن ایجاد کنید:
⦁ $ touch src/app.ts
⦁
در این مرحله ، ساختار پوشه باید به شکل زیر باشد:
├── node_modules/
├── src/
├── app.ts
├── package-lock.json
├── package.json
├── tsconfig.json
├── tslint.json

فایل app.ts را با یک ویرایشگر متن مورد نظر خود باز کنید و در قسمت کد زیر قرار دهید:
src/app.ts
import express from ‘express’;

const app = express();
const port = 3000;
app.get(‘/’, (req, res) => {
res.send(‘The sedulous hyena ate the antelope!’);
});
app.listen(port, err => {
if (err) {
return console.error(err);
}
return console.log(`server is listening on ${port}`);
});

کد بالا Node Server را ایجاد می کند که پورت 3000 را برای درخواست ها گوش می دهد. برنامه را با استفاده از دستور زیر اجرا کنید:
⦁ $ npm start
⦁
اگر با موفقیت اجرا شود ، پیامی به ترمینال وارد می شود:
Output
⦁ $ server is listening on 3000

اکنون می توانید در مرورگر خود از http: // localhost: 3000 بازدید کنید و باید این پیام را مشاهده کنید:
Output
⦁ $ The sedulous hyena ate the antelope!

فایل dist / app.js را باز کنید و نسخه تعویض شده کد TypeScript را پیدا خواهید کرد:
dist/app.js
use strict”;

var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { default”: mod };
};
Object.defineProperty(exports, __esModule”, { value: true });
const express_1 = __importDefault(require(express”));
const app = express_1.default();
const port = 3000;
app.get(‘/’, (req, res) => {
res.send(‘The sedulous hyena ate the antelope!’);
});
app.listen(port, err => {
if (err) {
return console.error(err);
}
return console.log(`server is listening on ${port}`);
});

//# sourceMappingURL=app.js.map

در این مرحله شما با موفقیت پروژه Node خود را برای استفاده از TypeScript تنظیم کرده اید.
نتیجه
در این آموزش ، آموختید که چرا TypeScript برای نوشتن کد قابل اعتماد JavaScript مفید است . همچنین در مورد برخی از مزایای کار با TypeScript اطلاعات کسب کردید.
سرانجام ، یک پروژه Node را با استفاده از چارچوب Express تنظیم کرده اید ، اما پروژه را با استفاده از TypeScript کامپایل و اجرا می کنید.

 

برچسب‌ها:Express, JavaScript, TypeScript