TypeScript হল JavaScript-এর একটি টাইপ করা সুপারসেট যা সাধারণ JavaScript-এ কম্পাইল করে। নিচের স্নিপেটটি TypeScript ব্যবহার করে Google Maps-এর সহজ ব্যবহার দেখায়।
let map: google.maps.Map;
const center: google.maps.LatLngLiteral = {lat: 30, lng: -110};
function initMap(): void {
map = new google.maps.Map(document.getElementById("map") as HTMLElement, {
center,
zoom: 8
});
}
শুরু করা
DefinitelyTyped প্রোজেক্ট হল একটি ওপেন সোর্স প্রোজেক্ট যা Google Maps সহ অনেক প্যাকেজের জন্য ডিক্লারেশন ফাইল টাইপ বজায় রাখে। Google Maps JavaScript ডিক্লারেশন ফাইল (GitHub-এ সোর্স ফাইল দেখুন) @types/google.maps প্যাকেজ থেকে NPM ব্যবহার করে ইনস্টল করা যেতে পারে।
npm i -D @types/google.maps
আলফা ও বিটা ফিচার
সাধারণত types-এ আলফা বা বিটা রিলিজে পাওয়া যায় এমন প্রপার্টি, ফাংশন বা ক্লাস থাকে না। এইসব ক্ষেত্রে, অবজেক্টটি সঠিক টাইপে কাস্ট করা যেতে পারে।
MapOptions-এর জন্য mapId বিটা প্রপার্টির কারণে নিম্নলিখিত সমস্যাটি হয়েছে।
error TS2345: Argument of type '{ center: google.maps.LatLng; zoom: number;
mapId: string; }' is not assignable to parameter of type 'MapOptions'. Object
literal may only specify known properties, and 'mapId' does not exist in type
'MapOptions'.
নিচে উল্লেখ করা কাস্টের মাধ্যমে উপরে উল্লেখ করা সমস্যার সমাধান করা যেতে পারে।
{ center: {lat: 30, lng: -110}, zoom: 8, mapId: '1234' } as google.maps.MapOptions
দ্বন্দ্বমূলক @types প্যাকেজ
কিছু লাইব্রেরি @types/google.maps ছাড়া অন্য প্যাকেজ ব্যবহার করতে পারে, যার ফলে সমস্যা হতে পারে। অসামঞ্জস্যপূর্ণ ধরনের সমস্যা এড়াতে skipLibCheck কম্পাইলার বিকল্প ব্যবহার করুন।
{
"compilerOptions": {
"skipLibCheck": true
}
}
typeRoots উল্লেখ করুন
Angular-এর মতো কিছু ফ্রেমওয়ার্কে typeRoots কম্পাইলার বিকল্প উল্লেখ করার প্রয়োজন হতে পারে যাতে @types/google.maps এবং অন্যান্য সব "@types" প্যাকেজ থেকে ইনস্টল করা ধরন অন্তর্ভুক্ত করা যায়।
{
...
"compilerOptions": {
...
"typeRoots": [
"node_modules/@types",
],
...
}
}