ब्लॉग पर वापस
Guide3 मिनट पढ़ें

FiveM टाइपस्क्रिप्ट डेवलपमेंट: टाइप्स के साथ आधुनिक स्क्रिप्ट्स

FiveM स्क्रिप्ट्स को TypeScript में लिखें। सेटअप बनाएं, natives typings, bundling और क्यों शीर्ष डेवलपर्स 2026 में plain Lua को TS के लिए छोड़ रहे हैं।

Agency Scripts

Agency Scripts के संस्थापक और प्रमुख डेवलपर

क्यों FiveM के लिए TypeScript?

TypeScript FiveM विकास में स्थैतिक टाइप चेकिंग, आधुनिक JavaScript फीचर्स, और बेहतर IDE सपोर्ट लाता है। जबकि Lua मानक स्क्रिप्टिंग भाषा बनी रहती है, TypeScript से संकलित JavaScript FiveM में JavaScript रनटाइम के माध्यम से मूल रूप से चलता है। टाइप सुरक्षा कंपाइल समय पर बग पकड़ती है जो अन्यथा रनटाइम पर आपके सर्वर को क्रैश कर सकती हैं, ऑटोकंप्लीशन विकास को काफी तेज़ करता है, और इंटरफेस आपके कोड को स्व-डॉक्यूमेंटिंग बनाते हैं। कई डेवलपर्स वाले जटिल प्रोजेक्ट्स के लिए, TypeScript समन्वय ओवरहेड को कम करता है और रिफैक्टरिंग को सुरक्षित बनाता है।

fivem-ts-boilerplate के साथ प्रोजेक्ट सेटअप

TypeScript FiveM प्रोजेक्ट शुरू करने का सबसे तेज़ तरीका है समुदाय का fivem-ts-boilerplate उपयोग करना। टेम्पलेट रिपॉजिटरी क्लोन करें, चलाएं npm install निर्भरता सेट करने के लिए, और आपके पास अलग-अलग क्लाइंट, सर्वर, और साझा स्रोत निर्देशिकाओं के साथ उपयोग के लिए तैयार प्रोजेक्ट संरचना होती है। बोइलरप्लेट में एक webpack कॉन्फ़िगरेशन शामिल है जो TypeScript को JavaScript बंडलों में संकलित करता है जो FiveM के अनुकूल हैं, साथ ही FiveM natives, citizen functions, और सामान्य फ्रेमवर्क APIs के लिए टाइप परिभाषाएँ भी शामिल हैं। अपने प्रोजेक्ट को बनाएं npm run build और आउटपुट सीधे एक संसाधन फ़ोल्डर में जाता है।

प्रकार परिभाषाएँ और नेटिव्स

यह @citizenfx/client और @citizenfx/server टाइप पैकेज सभी FiveM नेटिव फ़ंक्शंस और API कॉल्स के लिए TypeScript परिभाषाएँ प्रदान करते हैं। ये परिभाषाएँ ऑटोकम्प्लीशन सक्षम करती हैं जैसे कि GetEntityCoords, SetEntityHealth, और RegisterCommand", कोडिंग करते समय आपको पैरामीटर प्रकार और रिटर्न मान दिखाना। QBCore या ESX जैसे फ्रेमवर्क-विशिष्ट API के लिए, आप अतिरिक्त प्रकार परिभाषा फ़ाइलें बना या इंस्टॉल कर सकते हैं जो फ्रेमवर्क निर्यात और घटनाओं को कवर करती हैं। यह आपके IDE को पूरे FiveM API के लिए एक इंटरैक्टिव दस्तावेज़ ब्राउज़र में बदल देता है।

क्लाइंट और सर्वर आर्किटेक्चर

अपने TypeScript प्रोजेक्ट को क्लाइंट और सर्वर कोड के बीच स्पष्ट विभाजन के साथ संरचित करें। इंटरफेस, enums, और उपयोगिता फ़ंक्शंस के लिए साझा निर्देशिका का उपयोग करें जिनकी दोनों पक्षों को आवश्यकता होती है। साझा प्रकारों में इवेंट पेलोड इंटरफेस परिभाषित करें ताकि कंपाइलर यह सत्यापित करे कि क्लाइंट और सर्वर डेटा आकृतियों पर सहमत हैं। फ्रेमवर्क रैपर्स को एक सर्विस लेयर से आयात करें जो अंतर्निहित फ्रेमवर्क को अमूर्त करता है, जिससे आपका व्यवसाय लॉजिक QBCore, ESX, और standalone सेटअप्स के बीच पोर्टेबल हो। यह वास्तुकला आपके कोडबेस को मॉड्यूलर और परीक्षण योग्य बनाती है।

FiveM में TypeScript डिबगिंग

कंपाइल किए गए कोड का डिबगिंग चुनौतीपूर्ण हो सकता है क्योंकि निष्पादित जावास्क्रिप्ट आपके TypeScript स्रोत से भिन्न होता है। त्रुटि स्टैक ट्रेस आपके मूल TypeScript फ़ाइलों का संदर्भ दें, इसके लिए अपने webpack कॉन्फ़िगरेशन में सोर्स मैप्स सक्षम करें। उपयोग करें console.log स्टेटमेंट्स जो सर्वर-साइड डिबगिंग के लिए FiveM सर्वर कंसोल को फॉरवर्ड किए जाते हैं। क्लाइंट-साइड डिबगिंग के लिए, F8 के माध्यम से सुलभ NUI डेवलपर टूल्स जावास्क्रिप्ट निष्पादन का निरीक्षण कर सकते हैं। एक संरचित लॉगिंग यूटिलिटी जोड़ने पर विचार करें जिसमें टाइमस्टैम्प, लॉग स्तर, और स्रोत फ़ाइल संदर्भ शामिल हों ताकि संकलित आउटपुट के माध्यम से समस्याओं का पता लगाना आसान हो।

Lua के साथ माइग्रेशन और सह-अस्तित्व

आपको अपनी पूरी सर्वर को एक बार में TypeScript में कन्वर्ट करने की जरूरत नहीं है। TypeScript रिसोर्सेज Lua रिसोर्सेज के साथ पूरी तरह सह-अस्तित्व में हैं क्योंकि वे एक ही इवेंट और एक्सपोर्ट सिस्टम के माध्यम से संवाद करते हैं। नए फीचर्स TypeScript में बनाना शुरू करें जबकि मौजूदा Lua स्क्रिप्ट्स को बनाए रखें। TypeScript से Lua एक्सपोर्ट कॉल करते समय, अपेक्षित फंक्शन सिग्नेचर्स का वर्णन करने वाले टाइप डिक्लेरेशन बनाएं। जैसे-जैसे आप TypeScript वर्कफ़्लो में आत्मविश्वास प्राप्त करते हैं, महत्वपूर्ण सिस्टम्स को धीरे-धीरे माइग्रेट करें। यह क्रमिक दृष्टिकोण आपकी टीम को TypeScript सीखने देता है जबकि सर्वर स्थिर रहता है और जोखिम भरे पूर्ण पुनर्लेखन से बचाता है।

शुरू करने के लिए तैयार?

हमारी शॉप से स्क्रिप्ट लें, या सपोर्ट, अपडेट और आगे आने वाली चीज़ों की झलक के लिए Discord से जुड़ें।