TypeScript, JavaScript'in türü belirlenmiş bir üst kümesidir ve düz JavaScript'e derlenir. Aşağıdaki snippet'te, TypeScript kullanılarak Google Haritalar'ın basit kullanımı gösterilmektedir.
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
});
}
Başlarken
DefinitelyTyped projesi, Google Haritalar da dahil olmak üzere birçok paket için tür bildirim dosyalarını barındıran açık kaynaklı bir projedir. Google Haritalar JavaScript bildirim dosyaları (GitHub'daki kaynak dosyalara bakın), @types/google.maps paketinden NPM kullanılarak yüklenebilir.
npm i -D @types/google.maps
Alfa ve Beta Özellikler
Türler genellikle alfa veya beta sürümlerinde bulunan özellikleri, işlevleri ya da sınıfları içermez. Bu durumların çoğunda nesne doğru türe dönüştürülebilir.
Aşağıdaki hata, MapOptions için mapId beta özelliğinden kaynaklanıyor.
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'.
Yukarıdaki hata, aşağıdaki tür dönüştürme işlemiyle düzeltilebilir.
{ center: {lat: 30, lng: -110}, zoom: 8, mapId: '1234' } as google.maps.MapOptions
Çakışan @types paketleri
Bazı kitaplıklar, @types/google.maps dışında bir paket kullanabilir. Bu durum, çakışmalara neden olabilir. Tutarsız türlerle ilgili sorunları önlemek için skipLibCheck derleyici seçeneğini kullanın.
{
"compilerOptions": {
"skipLibCheck": true
}
}
typeRoots'u belirtme
Angular gibi bazı çerçeveler, @types/google.maps ve diğer tüm "@types" paketlerinden yüklenen türleri dahil etmek için typeRoots derleyici seçeneğinin belirtilmesini gerektirebilir.
{
...
"compilerOptions": {
...
"typeRoots": [
"node_modules/@types",
],
...
}
}