विज़ुअल स्टूडियो कोड के साथ टाइपस्क्रिप्ट सेट अप करना

विज़ुअल स्टूडियो कोड (VSCode) एक शक्तिशाली और लोकप्रिय कोड संपादक है जो टाइपस्क्रिप्ट विकास के लिए उत्कृष्ट समर्थन प्रदान करता है। यह मार्गदर्शिका आपको VSCode में टाइपस्क्रिप्ट सेट अप करने के चरणों के माध्यम से ले जाएगी, यह सुनिश्चित करते हुए कि आपके पास प्रभावी ढंग से कोडिंग शुरू करने के लिए आवश्यक सभी चीजें हैं।

विज़ुअल स्टूडियो कोड स्थापित करना

यदि आपने अभी तक Visual Studio Code स्थापित नहीं किया है, तो इन चरणों का पालन करें:

1. आधिकारिक VSCode वेबसाइट पर जाएं।
2. अपने ऑपरेटिंग सिस्टम के लिए इंस्टॉलर डाउनलोड करें।
3. इंस्टॉलर चलाएं और इंस्टॉलेशन पूरा करने के लिए ऑन-स्क्रीन निर्देशों का पालन करें।

Node.js और npm स्थापित करना

टाइपस्क्रिप्ट को npm (नोड पैकेज मैनेजर) के माध्यम से प्रबंधित किया जाता है, जिसके लिए Node.js की आवश्यकता होती है। Node.js और npm को इंस्टॉल करने के लिए:

1. आधिकारिक Node.js वेबसाइट पर जाएँ।
2. Node.js का LTS संस्करण डाउनलोड करें और इंस्टॉल करें, जिसमें npm शामिल है।
3. टर्मिनल खोलकर और Node.js और npm के संस्करणों की जांच करने के लिए node -v और npm -v चलाकर इंस्टॉलेशन को सत्यापित करें।

टाइपस्क्रिप्ट स्थापित करना

Node.js और npm इंस्टॉल होने के बाद, अब आप TypeScript को वैश्विक रूप से इंस्टॉल कर सकते हैं। टर्मिनल खोलें और निम्न कमांड चलाएँ:

npm install -g typescript

यह कमांड वैश्विक स्तर पर TypeScript स्थापित करता है, जिससे आप अपने सिस्टम पर कहीं से भी TypeScript फ़ाइलों को संकलित करने के लिए tsc कमांड का उपयोग कर सकते हैं।

टाइपस्क्रिप्ट प्रोजेक्ट सेट अप करना

नया TypeScript प्रोजेक्ट शुरू करने के लिए, इन चरणों का पालन करें:

1. अपने प्रोजेक्ट के लिए एक नई निर्देशिका बनाएं और उसमें जाएँ:

mkdir my-typescript-project
cd my-typescript-project

1. एक नया npm प्रोजेक्ट आरंभ करें:

npm init -y

1. TypeScript को विकास निर्भरता के रूप में स्थापित करें:

npm install --save-dev typescript

1. टाइपस्क्रिप्ट कॉन्फ़िगरेशन फ़ाइल बनाएं:

npx tsc --init

यह कमांड आपकी प्रोजेक्ट निर्देशिका में एक tsconfig.json फ़ाइल बनाता है, जिसमें टाइपस्क्रिप्ट कंपाइलर के लिए कॉन्फ़िगरेशन सेटिंग्स होती हैं।

TypeScript के लिए VSCode को कॉन्फ़िगर करना

VSCode अंतर्निहित TypeScript समर्थन के साथ आता है, लेकिन आप संपादक को कॉन्फ़िगर करके अपने विकास अनुभव को और बढ़ा सकते हैं:

अपना प्रोजेक्ट खोलना

VSCode में अपना TypeScript प्रोजेक्ट खोलें:

1. VSCode लॉन्च करें.
2. File > Open Folder... का चयन करें और अपनी प्रोजेक्ट निर्देशिका चुनें।

टाइपस्क्रिप्ट एक्सटेंशन स्थापित करना

जबकि VSCode उत्कृष्ट TypeScript समर्थन प्रदान करता है, आप बढ़ी हुई कार्यक्षमता के लिए अतिरिक्त एक्सटेंशन स्थापित कर सकते हैं:

• टाइपस्क्रिप्ट एक्सटेंशन: टाइपस्क्रिप्ट भाषा समर्थन और इंटेलिसेंस, कोड नेविगेशन और अधिक जैसी सुविधाएँ प्रदान करता है।
• Prettier: कोड स्वरूपण के लिए एक एक्सटेंशन, जो सुसंगत कोड शैली सुनिश्चित करता है।

टाइपस्क्रिप्ट कंपाइलर को कॉन्फ़िगर करना

टाइपस्क्रिप्ट कंपाइलर सेटिंग्स को कॉन्फ़िगर करने के लिए tsconfig.json फ़ाइल खोलें। यहाँ एक उदाहरण कॉन्फ़िगरेशन दिया गया है:

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "outDir": "./dist",
    "sourceMap": true
  },
  "include": [
    "src/**/*"
  ],
  "exclude": [
    "node_modules"
  ]
}

यह कॉन्फ़िगरेशन लक्ष्य ECMAScript संस्करण को ES6 पर सेट करता है, CommonJS मॉड्यूल प्रारूप निर्दिष्ट करता है, सख्त प्रकार जाँच सक्षम करता है, और आउटपुट निर्देशिका को ./dist पर सेट करता है। इसमें आसान डिबगिंग के लिए स्रोत मानचित्र भी शामिल हैं।

टाइपस्क्रिप्ट कोड लिखना और चलाना

src निर्देशिका में एक नई TypeScript फ़ाइल बनाएँ:

mkdir src
touch src/index.ts

index.ts में कुछ TypeScript कोड जोड़ें:

const message: string = "Hello, TypeScript!";
console.log(message);

अपने TypeScript कोड को संकलित करने के लिए चलाएँ:

npx tsc

यह कमांड आपकी टाइपस्क्रिप्ट फ़ाइलों को संकलित करता है और जावास्क्रिप्ट फ़ाइलों को dist निर्देशिका में आउटपुट करता है।

संकलित जावास्क्रिप्ट कोड को चलाने के लिए उपयोग करें:

node dist/index.js

निष्कर्ष

Visual Studio Code के साथ TypeScript सेट अप करना एक सीधी प्रक्रिया है जिसमें आवश्यक उपकरण इंस्टॉल करना, अपने प्रोजेक्ट को कॉन्फ़िगर करना और VSCode की शक्तिशाली सुविधाओं का उपयोग करना शामिल है। इस गाइड का पालन करके, आपके पास पूरी तरह से कार्यात्मक TypeScript विकास वातावरण होगा और आप TypeScript के साथ मजबूत एप्लिकेशन बनाने के लिए तैयार होंगे।