TypeScript, düz JavaScript'te derlenen, yazılan bir JavaScript üst kümesidir. 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şlayın
DefinitelyTyped projesi, Google Haritalar dahil birçok paket için tür beyan dosyalarını koruyan açık kaynaklı bir projedir. Google Haritalar JavaScript bildirim dosyaları (GitHub'daki kaynak dosyalara bakın), @types/google.maps paketinden AİOY kullanılarak yüklenebilir.
npm i -D @types/google.maps
Alfa ve Beta Özellikler
Türler genellikle alfa veya beta sürümlerinde bulunan özelliklere, işlevlere veya sınıflara sahip değildir. 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 kaynaklanmaktadır.
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 Cast ile düzeltilebilir.
{ center: {lat: 30, lng: -110}, zoom: 8, mapId: '1234' } as google.maps.MapOptions
Çakışan @types paketleri
Bazı kitaplıklar, çakışmalara neden olabilecek @types/google.maps dışında bir paket kullanabilir. Tutarsız türlerle ilgili sorunları önlemek için skipLibCheck derleyici seçeneğini kullanın.
{
"compilerOptions": {
"skipLibCheck": true
}
}
typeRoots 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",
],
...
}
}