TypeScript هي مجموعة كبيرة من لغة JavaScript يتم تجميعها بلغة JavaScript عادية. يوضح المقتطف أدناه الاستخدام البسيط لخرائط Google باستخدام TypeScript.
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". يمكن تثبيت ملفات تعريف JavaScript لـ "خرائط Google" (اطّلع على ملفات المصدر على GitHub) باستخدام NPM من حزمة @types/google.maps.
npm i -D @types/google.maps
الميزات الأولية والتجريبية
لا تحتوي الأنواع عادةً على الخصائص أو الدوال أو الفئات الموجودة في الإصدارات ألفا أو الإصدارات التجريبية. في العديد من هذه الحالات، يمكن تحويل الكائن إلى النوع الصحيح.
حدث الخطأ التالي بسبب سمة mapId التجريبية في MapOptions.
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",
],
...
}
}